<template>
  <div v-cloak id="app">
    <!-- 快捷键提示 -->
    <div class="keyBoardTip" @click="keyBoardTipMsg = true"><i class="tipIcon"/> 快捷键提示</div>
    <el-menu
      :default-active="activeIndex"
      class="el-menu-demo"
      mode="horizontal"
      @select="handleSelect"
    >
      <el-menu-item index="1">
        <i class="icon tab_ic_register"/>医疗挂号
      </el-menu-item
      >
      <el-menu-item
        :disabled="false"
        index="2"
      ><i class="icon tab_ic_local"/>本地挂号信息
      </el-menu-item
      >
      <el-menu-item
        index="3"
      ><i class="icon tab_ic_his"/>HIS系统挂号信息
      </el-menu-item
      >
    </el-menu>
    <!-- 医疗挂号 -->
    <div v-if="activeIndex === '1'" class="pageBody">
      <div class="step">
        <div :class="{active: activePageIndex === 1}" class="stepItem">
          <div v-if="activePageIndex <= 1" class="stepNum">1</div>
          <img
            v-else
            style="width: 24px; height: 24px"
            src="../../static/images/step_ic_done.png"
            alt=""
          >
          <div class="icon step_ic_hospital"/>
          <div class="title">医院科室信息</div>
        </div>
        <div :class="{activeLine: activePageIndex === 2}" class="line"/>
        <div :class="{active: activePageIndex === 2}" class="stepItem">
          <div v-if="activePageIndex <= 2" class="stepNum">2</div>
          <img
            v-else
            style="width: 24px; height: 24px"
            src="../../static/images/step_ic_done.png"
            alt=""
          >
          <div class="icon step_ic_accept"/>
          <div class="title">受理挂号业务</div>
        </div>
        <div :class="{activeLine: activePageIndex === 3}" class="line"/>
        <div :class="{active: activePageIndex === 3}" class="stepItem">
          <div v-if="activePageIndex <= 3" class="stepNum">3</div>
          <img
            v-else
            style="width: 24px; height: 24px"
            src="../../static/images/step_ic_done.png"
            alt=""
          >
          <div class="icon step_ic_pay"/>
          <div class="title">付费方式选择</div>
        </div>
        <div :class="{activeLine: activePageIndex === 4}" class="line"/>
        <div :class="{active: activePageIndex === 4}" class="stepItem">
          <div v-if="activePageIndex <= 4" class="stepNum">4</div>
          <img
            v-else
            style="width: 24px; height: 24px"
            src="../../static/images/step_ic_done.png"
            alt=""
          >
          <div class="icon step_ic_result"/>
          <div class="title">返回结果信息</div>
        </div>
      </div>
      <div class="headerOper">
        <div v-if="activePageIndex === 1" class="operLeft">
          <el-button
            type="success"
            class="tagSuccess"
            round
            size="medium"
            plain
          ><i class="icon successIcon"/> 来电数
            <span
              style="font-weight: bold; margin-left: 5px"
            >{{ userMark.CALL_TOTAL }}</span
          ></el-button
          >
          <el-button
            type="primary"
            class="tagPrimary"
            round
            size="medium"
            plain
          ><i class="icon primaryIcon"/> 挂号数
            <span
              style="font-weight: bold; margin-left: 5px"
            >{{ userMark.SCHEDULE_TOTAL }}</span
          ></el-button
          >
          <el-button
            v-if="userMark.RTES_FLAG > 0"
            type="danger"
            class="tagDanger"
            round
            size="medium"
            plain
          ><i class="icon dangerIconOne"/> 拒绝代挂号
          </el-button
          >
          <el-button
            v-if="userMark.RVIP_FALG > 0"
            type="danger"
            class="tagDanger"
            round
            size="medium"
            plain
          ><i class="icon dangerIconTwo"/> 拒绝代办陪诊
          </el-button
          >
          <div
            style="
                display: inline-block;
                margin-left: 10px;
                position: relative;
              "
          >
            <el-button
              v-if="userMark.YOUFU_VIP_LIST&&userMark.YOUFU_VIP_LIST.length != 0"
              type="warning"
              round
              size="medium"
              @click="memberDialog = true"
            ><i class="icon warningIcon"/> 家医两年会员
            </el-button
            >
            <transition name="fade">
              <div v-if="memberDialog" class="memeberInfo">
                <div class="header">
                  <div
                    class="name"
                    style="display: flex; align-items: center"
                  >
                    <img src="../../static/images/member_pic_sign.png" alt="">
                    <div
                      style="
                          font-size: 20px;
                          font-weight: bold;
                          font-family: 'SourceHanSansCN Regular';
                          margin: 0 10px;
                        "
                    >
                      {{ userMark.YOUFU_VIP_LIST[0].NAME }}
                    </div>
                    <div
                      style="
                          font-size: 16px;
                          color: #666a6f;
                          font-family: 'SourceHanSansCN Regular';
                        "
                    >
                      {{ userMark.YOUFU_VIP_LIST[0].CALLER }}
                    </div>
                  </div>
                  <div class="detailInfo">
                    <span
                      v-for="item in userPhoneMeal"
                      :key="item.id || index"
                      class="itemText"
                    >{{ item }}</span
                    >
                  </div>
                </div>
                <div class="title1">使用服务</div>
                <div class="itemContaier">
                  <div
                    v-if="userMark.YOUFU_VIP_LIST[0].VIP_SERVE.includes('挂号代办')"
                    class="item"
                  >
                    <img src="../../static/images/member_pic_serve_01.png" alt="">
                    <span>挂号代办</span>
                  </div>
                  <div
                    v-if="userMark.YOUFU_VIP_LIST[0].VIP_SERVE.includes('取号代办')"
                    class="item"
                  >
                    <img src="../../static/images/member_pic_serve_02.png" alt="">
                    <span>取号代办</span>
                  </div>
                  <div
                    v-if="userMark.YOUFU_VIP_LIST[0].VIP_SERVE.includes('有号提醒')"
                    class="item"
                  >
                    <img src="../../static/images/member_pic_serve_03.png" alt="">
                    <span>有号提醒</span>
                  </div>
                  <div
                    v-if="userMark.YOUFU_VIP_LIST[0].VIP_SERVE.includes('健康咨询')"
                    class="item"
                  >
                    <img src="../../static/images/member_pic_serve_04.png" alt="">
                    <span>健康咨询</span>
                  </div>
                  <div
                    v-if="userMark.YOUFU_VIP_LIST[0].VIP_SERVE.includes('全程陪诊')"
                    class="item"
                  >
                    <img src="../../static/images/member_pic_serve_05.png" alt="">
                    <span>全程陪诊</span>
                  </div>
                </div>
                <div class="footer">
                  <el-button
                    type="primary"
                    style="padding: 7px 15px; font-size: 14px"
                    size="mini"
                    @click="memberDialog = false"
                  >我已知晓
                  </el-button
                  >
                </div>
              </div>
            </transition>
          </div>
        </div>
        <div v-if="activePageIndex === 1" class="operRight">
          <el-dropdown>
            <el-button type="primary" size="medium" style="padding: 8px 12px">
              更多操作<i class="el-icon-caret-bottom el-icon--right"/>
            </el-button>
            <el-dropdown-menu slot="dropdown" class="moveOperMenu">
              <el-dropdown-item
                onclick="app.angetGuideHandle(0)"
              >成功引导
              </el-dropdown-item
              >
              <el-dropdown-item
                v-if="userMark.RTES_FLAG <= 0"
                onclick="app.angetGuideHandle(2)"
              >拒绝代挂号
              </el-dropdown-item
              >
              <el-dropdown-item
                v-if="userMark.RVIP_FALG <= 0"
                onclick="app.angetGuideHandle(1)"
              >拒绝代办陪诊
              </el-dropdown-item
              >
              <el-dropdown-item
                onclick="app.angetGuideHandle(3)"
              >其他1
              </el-dropdown-item
              >
              <el-dropdown-item
                onclick="app.angetGuideHandle(4)"
              >其他2
              </el-dropdown-item
              >
            </el-dropdown-menu>
          </el-dropdown>
        </div>
        <div v-if="activePageIndex !== 1" class="operLeft">
          <el-button
            type="primary"
            class="tagPrimary"
            round
            size="medium"
            plain
          ><i class="icon data_ic_caller"/>当前主叫
            <span style="font-weight: bold; margin-left: 5px">{{ caller }}</span>
          </el-button>
          <el-button
            type="warning"
            class="tagWarning"
            round
            size="medium"
            plain
          ><i class="icon data_ic_cs"/>座席工号
            <span
              style="font-weight: bold; margin-left: 5px"
            >{{ agentId }}</span
          ></el-button
          >
          <el-button
            type="success"
            class="tagSuccess"
            round
            size="medium"
            plain
          ><i class="icon data_ic_time"/>健康管家工作时间
          每天07:00-20:00
          </el-button
          >
        </div>
      </div>
      <div class="pageContainer">
        <!-- 医院科室信息 -->
        <div v-if="activePageIndex === 1" class="hospitalDepartInfor">
          <div class="body">
            <div class="bodyLeft" @mouseover="isPartInforNunber = 2" @mouseout="isPartInforNunber = 3">
              <div class="title">医院科室检索</div>
              <el-form
                :inline="true"
                :model="formInline"
                class="demo-form-inline"
                label-width="78px"
                label-position="right"
              >
                <el-form-item label="查询方式">
                  <el-radio-group
                    v-model="formInline.searchStyle"
                    @input="searchRadio"
                  >
                    <el-radio v-onfocus label="按医院"/>
                    <el-radio label="按科室"/>
                  </el-radio-group>
                </el-form-item>
                <el-form-item
                  v-if="formInline.searchStyle == '按医院'"
                  style="margin-top: -9px"
                  label="挂号医院"
                >
                  <el-select
                    v-scroll="handleScroll"
                    ref="hospitalSelectName"
                    v-model="formInline.hospitalNo"
                    :filter-method="filterFn"
                    filterable
                    clearable
                    size="medium"
                    style="width: 230px"
                    placeholder="输入中文/简拼"
                    @change="selectHospotalFn"
                    @visible-change="isShowMenu"
                    @clear="clearSelectFn"
                  >
                    <el-option
                      v-for="item in hospitalList"
                      :label="item.HOSPITALNAME "
                      :key="item.HOSPITALNO"
                      :value="item.HOSPITALNO"
                    />
                  </el-select>
                </el-form-item>
                <el-form-item
                  v-if="formInline.searchStyle == '按科室'"
                  style="margin-top: -9px"
                  label="科室/专业"
                >
                  <el-input
                    ref="hospitalInputDepart"
                    v-model="formInline.DepartmentName"
                    size="medium"
                    style="width: 230px"
                    placeholder="请输入中文/简拼"
                    @keyup.enter.native="onSubmit"
                  />
                </el-form-item>
                <el-form-item label="挂号日期">
                  <el-date-picker
                    v-model="formInline.date1"
                    :picker-options="pickerOptions"
                    :clearable="false"
                    type="date"
                    placeholder="选择挂号日期"
                    size="medium"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd"
                    style="width: 160px"
                    @change="timeChangeFn"
                  />
                </el-form-item>
                <el-form-item>
                  <el-button
                    type="primary"
                    size="small"
                    @click="onSubmit"
                  >查询
                  </el-button
                  >
                </el-form-item>
              </el-form>
              <div class="line"/>
              <div class="tree">

                <!-- :render-content="renderContent" -->
                <el-tree
                  :data="data"
                  :props="defaultProps"
                  highlight-current
                  @node-click="handleNodeClick"
                >
                  <span slot-scope="{ node, data }" class="custom-tree-node" style="font-size: 14px;">
                    <span>
                      <span style="margin-right: 5px;">{{ node.label }}</span>
                      <!-- 如果需要显示可用注册数量，可以取消下面这行的注释 -->
                      <!--
      <span :style="data.AVAILABLEREGCOUNT == '0' || data.AVAILABLEREGNUMBERS == '0'? 'color:#ee4822' : 'color:#1a7ef2'">
        {{ data.AVAILABLEREGCOUNT > data.AVAILABLEREGNUMBERS ? data.AVAILABLEREGNUMBERS : data.AVAILABLEREGCOUNT }}
      </span>
      -->
                    </span>
                  </span>
                </el-tree>
                <div class="affiche" @click="lookHospotalaffiche">
                  <div class="afficheIcon"/>
                  <!--                  <div-->
                  <!--                    ref="afficheContext"-->
                  <!--                    :class="selectHospitalItem.RECENTMEMOINFO ? 'afficheCartoon':''"-->
                  <!--                    class="afficheContext"-->
                  <!--                  >-->
                  <!--                    {{-->
                  <!--                      selectHospitalItem.RECENTMEMOINFO-->
                  <!--                        ? selectHospitalItem.RECENTMEMOINFO.replace(/<\/?[^>]+(>|$)/g, "").replace(/nbsp;/g, " ").replace(/&/g, " ") : '医院公告'-->
                  <!--                    }}-->
                  <!--                  </div>-->
                  <div
                    ref="afficheContext"
                    :class="[selectHospitalItem.RECENTMEMOINFO ? 'afficheCartoon' : '', 'afficheContext']"
                  >
                    {{ memoInfo }}
                  </div>
                  <div class="coverBg"/>
                </div>
              </div>
            </div>
            <div
              class="bodyRight"
              style="overflow: hidden;"
              @mouseover="isPartInforNunber = 1"
              @mouseout="isPartInforNunber = 3">
              <div class="information" style="overflow: auto;">
                <div ref="scheduleInformation" style="min-width: 1322px; height: 100%;">
                  <div class="title">
                    排班信息
                    <span
                      class="tip"
                    >点击记录行操作按钮或双击记录行,进行下一步</span
                    >
                  </div>

                  <el-form
                    ref="form"
                    :inline="true"
                    :model="form"
                    style="margin-top: 20px; padding-left: 10px"
                    size="medium"
                    label-position="right"
                    label-width="80px"
                  >
                    <el-form-item label="医生姓名" label-width="73px">
                      <el-input
                        v-model="form.name"
                        style="width: 160px"

                        size="medium"
                        placeholder="输入中文/简拼"
                        @keyup.enter.native="onSubmit2"
                      />
                    </el-form-item>
                    <el-form-item label="科室/专业" class="margin-pub">
                      <el-input
                        v-model="form.offices"
                        style="width: 160px"
                        size="medium"
                        placeholder="输入中文/简拼"
                        @keyup.enter.native="onSubmit2"
                      />
                    </el-form-item>
                    <el-form-item
                      label="挂号类型"
                      class="margin-pub selectWidth"
                    >
                      <el-select
                        ref="regStyle"
                        v-model="form.style"
                        :filter-method="scheduleTypeListFilter"
                        style="width: 160px"
                        filterable
                        clearable
                        placeholder="请选择"
                        size="medium"
                        @visible-change="isShowFn"
                        @clear="clearStyleFn"
                      >
                        <el-option
                          v-for="(item,index) in scheduleTypeList"
                          :key="index"
                          :label="item.SCHEDULETYPENAME"
                          :value="item.SCHEDULETYPENO"
                        />
                      </el-select>
                    </el-form-item>
                    <el-form-item
                      label="排班时间"
                      class="margin-pub sceenWidth"
                    >
                      <el-date-picker
                        v-model="form.date1"
                        :clearable="false"
                        type="date"
                        format="yyyy-MM-dd"
                        value-format="yyyy-MM-dd"
                        size="medium"
                        placeholder="选择日期"
                        style="width: 140px"
                      />
                      <span> 至 </span>
                      <el-date-picker
                        v-model="form.date2"
                        :clearable="false"
                        size="medium"
                        format="yyyy-MM-dd"
                        value-format="yyyy-MM-dd"
                        type="date"
                        style="width: 140px"
                        placeholder="选择日期"
                      />
                    </el-form-item>
                    <el-form-item>
                      <el-button
                        type="primary"
                        size="medium"
                        @click="onSubmit2"
                      >查询
                      </el-button
                      >
                      <el-button
                        type="info"
                        size="medium"
                        @click="resetForm('form')"
                      >重置
                      </el-button
                      >
                    </el-form-item>
                  </el-form>
                  <div class="table">
                    <el-table
                      ref="singleTable"
                      :data="tableData"
                      :header-cell-style="headerCellStyle"
                      height="100%"
                      highlight-current-row
                      style="width: 100%; height: 100%; overflow: auto"
                      @current-change="val=>handleClick(val, 'click')"
                      @row-dblclick="row=>handleClick(row, 'dbClick')"
                    >
                      <el-table-column
                        min-width="263px"
                        show-overflow-tooltip
                        prop="DEPTNAME"
                        label="科室名称">
                        <template slot-scope="scope">
                          <span v-html="highlightDoctorName(scope.row.DEPTNAME,form.offices)"/>
                        </template>
                      </el-table-column>
                      <el-table-column min-width="104px" show-overflow-tooltip label="医生姓名">
                        <template slot-scope="scope">
                          <span v-html="highlightDoctorName(scope.row.DOCTORNAME,form.name)"/>
                        </template>
                      </el-table-column>
                      <el-table-column
                        show-overflow-tooltip
                        min-width="130px"
                        prop="DOCTORDEGREE"
                        label="医生职称"
                      />
                      <el-table-column
                        show-overflow-tooltip
                        min-width="169px"
                        label="专业名称"
                      >
                        <template slot-scope="scope">
                          <span v-html="highlightDoctorName(scope.row.SPECIALITYNAME,form.offices)"/>
                        </template>
                      </el-table-column>
                      <el-table-column
                        min-width="126px"
                        show-overflow-tooltip
                        prop="SCHEDULETYPENAME"
                        label="挂号类型"
                      >
                        <template slot-scope="scope">
                          <span>{{ scope.row.SCHEDULETYPENAME ? scope.row.SCHEDULETYPENAME : '--' }}</span>
                        </template>
                      </el-table-column>
                      <el-table-column
                        min-width="123px"
                        align="center"
                        prop="DUTYDATE"
                        label="值班日期"
                      />
                      <el-table-column
                        min-width="104px"
                        align="center"
                        prop="DUTYTIME"
                        label="值班时段"
                      >
                        <template slot-scope="scope">
                          <span
                          >{{
                            scope.row.DUTYTIME == 1 ? '上午' :
                            scope.row.DUTYTIME == 2 ? '中午' : scope.row.DUTYTIME
                            == 3 ? '下午' : scope.row.DUTYTIME == 4 ? '晚上' :
                            '未知'
                          }}</span
                          >
                        </template>
                      </el-table-column>
                      <el-table-column
                        min-width="91px"
                        align="center"
                        label="星期"
                      >
                        <template slot-scope="scope">
                          <span>{{ handleDataweek(scope.row.DUTYDATE) }}</span>
                        </template>
                      </el-table-column>

                      <!-- <el-table-column
                          min-width="104px"
                          align="center"
                          prop="AVAILABLEREGCOUNT"
                          label="剩余号源"
                        >
                        <template slot-scope="scope">
                          <span :style="scope.row.AVAILABLEREGCOUNT == '0' || scope.row.AVAILABLEREGNUMBERS == '0' ? 'color:#ee4822':'color:#1a7ef2'">
                            {{scope.row.AVAILABLEREGCOUNT>scope.row.AVAILABLEREGNUMBERS?scope.row.AVAILABLEREGNUMBERS:scope.row.AVAILABLEREGCOUNT}}</span>
                        </template>
                        </el-table-column> -->

                      <el-table-column
                        fixed="right"
                        align="center"
                        label="操作"
                        width="100"
                      >
                        <template slot-scope="scope">
                          <el-button
                            :disabled="scope.row.AVAILABLEREGCOUNT == ('0' || '')"
                            type="text"
                            size="medium"
                            @click.stop="handleClick(scope.row, 'action')"
                          >挂号
                          </el-button
                          >
                        </template>
                      </el-table-column>
                    </el-table>
                    <el-pagination
                      ref="paginationRef"
                      :current-page="lineDutyPageIndex"
                      :page-sizes="[10, 20, 30, 40]"
                      :page-size="lineDutyPageSize"
                      :total="lineDutyTotal"
                      style="
                          position: absolute;
                          bottom: 2px;
                          left: 7px;
                          right: 0;
                          padding: 5px 4px;
                          background: #f6f6f7;
                        "
                      background
                      class="gradePagination"
                      layout=" prev, pager, next, jumper, total, sizes"
                      @size-change="handleSizeChange"
                      @current-change="handleCurrentChange"
                    />
                  </div>
                </div>
              </div>
              <div class="detail">
                <div
                  :style="surplusNumber?'':'padding-bottom:0'"
                  class="detailLeft"
                >
                  <div class="title">
                    排班详情 -
                    <span
                      style="color: #4797f5"
                    >{{ infoDetail.SPECIALITYNAME || infoDetail.DEPTNAME || "无" }}</span
                    >
                  </div>
                  <div class="detailContainer">
                    <div class="detailItem">
                      <div>
                        <span class="detailInfoContanierTitle"/>
                        值班信息
                      </div>
                      <div class="detailInfoContanier">
                        <div class="detailInfoContanierItem">
                          <div class="detailInfoItem" style="flex: 2">
                            <div class="detailInfoTitle">剩余号源</div>
                            <div class="detailInfoContext" style="color: #ee4822;">
                              {{ surplusNumber || "无" }}
                            </div>
                          </div>
                          <div class="detailInfoItem">
                            <div class="detailInfoTitle">值班时段</div>
                            <div class="detailInfoContext">
                              {{
                                infoDetail.DUTYTIME == 1 ? '上午' :
                                infoDetail.DUTYTIME == 2 ?
                                  '中午' : infoDetail.DUTYTIME == 3 ?
                                    '下午' : infoDetail.DUTYTIME == 4 ? '晚上' : '无'
                              }}
                            </div>
                          </div>
                          <div class="detailInfoItem">
                            <div class="detailInfoTitle">值班星期</div>
                            <div class="detailInfoContext">
                              {{ handleDataweek(infoDetail.DUTYDATE) || "无" }}
                            </div>
                          </div>
                        </div>
                        <div class="detailInfoContanierItem">
                          <div class="detailInfoItem">
                            <div class="detailInfoTitle">值班班次</div>
                            <div class="detailInfoContext">
                              {{ infoDetail.WORKID || "无" }}
                            </div>
                          </div>
                          <div class="detailInfoItem">
                            <div class="detailInfoTitle">值班日期</div>
                            <div class="detailInfoContext">
                              {{ infoDetail.DUTYDATE || "无" }}
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="detailItem">
                      <div>
                        <span class="detailInfoContanierTitle"/>
                        医生信息
                      </div>
                      <div class="detailInfoContanier">
                        <div class="detailInfoContanierItem">
                          <div class="detailInfoItem">
                            <div class="detailInfoTitle">医生姓名</div>
                            <div class="detailInfoContext">
                              {{ infoDetail.DOCTORNAME || "无" }}
                            </div>
                          </div>
                          <div class="detailInfoItem">
                            <div class="detailInfoTitle">专业名称</div>
                            <div class="detailInfoContext">
                              {{ infoDetail.SPECIALITYNAME || "无" }}
                            </div>
                          </div>
                        </div>
                        <div class="detailInfoContanierItem">
                          <div class="detailInfoItem">
                            <div class="detailInfoTitle">医生职称</div>
                            <div class="detailInfoContext">
                              {{ infoDetail.DOCTORDEGREE || "无" }}
                            </div>
                          </div>
                          <div class="detailInfoItem">
                            <div class="detailInfoTitle">挂号类型</div>
                            <div class="detailInfoContext">
                              {{ infoDetail.SCHEDULETYPENAME || "无" }}
                            </div>
                          </div>
                        </div>
                        <div class="detailInfoContanierItem">
                          <div class="detailInfoItem">
                            <div class="detailInfoTitle">医生说明</div>
                            <div class="detailInfoContext">
                              {{ infoDetail.DOCTORDESC || "无" }}
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div v-if="surplusNumber" class="registration">
                    <el-button
                      ref="registrationBtn"
                      type="primary"
                      size="mini"
                      @click="registrationFn(2)"
                    >确定选择此科室，并开始挂号
                    </el-button
                    >
                  </div>
                </div>
                <div class="detailRight">
                  <div class="title" style="margin-left: 8px">
                    历史挂号记录
                  </div>
                  <div
                    :style="isMove?'':'height: calc(100% - 20px);'"
                    class="historyInfoContainer"
                  >
                    <div
                      v-for="(item, i) in userScheduleList"
                      :key="i"
                      class="hospitalItem"
                    >
                      <div style="font-size: 15px; color: #031223">
                        {{ item.HOSPITALNAME }}
                      </div>
                      <div>
                        <div class="operSteps">
                          <div
                            v-for="(el, index) in item.children"
                            :key="index"
                            class="operItem"
                          >
                            <div
                              v-if="index !== item.children.length - 1"
                              class="line"
                            />
                            <div class="cricle"/>
                            <div class="operItemContext">
                              <div class="operItemDetail">
                                【{{ el.DEPARTMENTNAME }}】<span
                                  style="font-weight: normal"
                                >{{ el.DOCTORNAME }}</span
                                >
                              </div>
                              <div class="operTime">{{ el.CREATEDATE }}</div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div
                      v-if="userScheduleList.length === 0"
                      class="noDataTip"
                    >
                      暂无数据
                    </div>
                  </div>
                  <div
                    v-if="isMove"
                    style="
                        position: absolute;
                        left: 50%;
                        bottom: 2px;
                        transform: translateX(-50%);
                      "
                  >
                    <el-button
                      v-if="isMove && userScheduleList.length > 0"
                      :loading="loadingList.isMoveMsg"
                      type="primary"
                      style="width: 310px"
                      size="mini"
                      @click="getmoveData"
                    >查看更多
                    </el-button
                    >
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- 受理挂号业务 -->
        <div
          v-else-if="activePageIndex === 2"
          class="AcceptRegistrationBusiness"
        >
          <div class="bodyLeft">
            <div
              style="
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                "
            >
              <div class="title">当前选择医院科室信息</div>
              <el-button
                type="primary"
                size="medium"
                style="padding: 7px 12px"
                @click="reSelectDepart"
              >重选科室
              </el-button
              >
            </div>
            <div class="detailContainer">
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  医生信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医院名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ selectHospitalItem.HOSPITALNAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">科室名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ selectDepartItem.DEPTNAME || infoDetail.DEPTNAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">专业名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.SPECIALITYNAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医生姓名
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DOCTORNAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医生职称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DOCTORDEGREE }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号类型
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.SCHEDULETYPENAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医生说明
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DOCTORDESC }}
                      </div
                      >
                    </div>
                  </div>
                </div>
              </div>
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  值班信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">值班日期
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DUTYDATE }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">值班时段</div>
                      <div
                        class="detailInfoContext"
                      >{{
                        infoDetail.DUTYTIME == 1 ? '上午' :
                        infoDetail.DUTYTIME == 2 ? '中午' : infoDetail.DUTYTIME
                        == 3 ? '下午' : infoDetail.DUTYTIME == 4 ? '晚上' : '无'
                      }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">值班星期</div>
                      <div
                        class="detailInfoContext"
                      >{{ handleDataweek(infoDetail.DUTYDATE) }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">值班班次
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.WORKID }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem" style="flex: 2">
                      <div class="detailInfoTitle">剩余号源</div>
                      <div
                        class="detailInfoContext"
                      >{{ surplusNumber }}
                      </div
                      >
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="bodyRight">
            <div
              style="
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                "
            >
              <div class="title">查询或填写用户信息</div>
              <!--  正式环境调用 @click="getCheckUserInfo"  -->
              <el-button
                ref="getUserInfo"
                :loading="loadingList.loading1"
                type="primary"
                size="medium"
                style="padding: 7px 12px"
                @click="getCheckUserInfoBtn"
              >查询用户
              </el-button
              >
            </div>
            <el-form
              ref="ruleForm"
              :rules="rules"
              :model="form2"
              label-width="112px"
              style="margin-top: 20px"
              size="medium"
            >
              <el-form-item label="实名卡号">
                <el-input
                  v-model="form2.cardNumber"
                  class="changeColorRed"
                  placeholder="请输入"
                  @keyup.enter.native="getCheckUserInfoBtn"
                />
              </el-form-item>
              <el-form-item label="身份证号码" prop="idCard">
                <el-input
                  v-focus
                  ref="idCardRef"
                  v-model="form2.idCard"
                  class="changeColorBlue"
                  placeholder="请输入"
                  @keyup.enter.native="getCheckUserInfoBtn"
                />
              </el-form-item>
              <el-form-item
                style="width: 50%; display: inline-block"
                label="姓名"
              >
                <el-input
                  v-model="form2.name"
                  placeholder="请输入"
                  @keyup.enter.native="getCheckUserInfoBtn"
                />
              </el-form-item>
              <el-form-item

                style="width: 49.4%; display: inline-block"
                label="性别"
              >
                <el-radio-group v-model="form2.sex">
                  <el-radio label="男"/>
                  <el-radio label="女"/>
                </el-radio-group>
              </el-form-item>
              <el-form-item
                label="年龄(岁)"
                style="width: 50%; display: inline-block"
              >
                <el-input
                  v-model.number="form2.age"
                  placeholder="请输入"
                  @keyup.enter.native="getCheckUserInfoBtn"/>
              </el-form-item>
              <el-form-item
                label="联系电话"
                style="width: 49.4%; display: inline-block"
              >
                <el-input
                  v-model="form2.phone"
                  placeholder="请输入"
                  @keyup.enter.native="getCheckUserInfoBtn"
                />
              </el-form-item>
              <el-form-item label="联系地址">
                <el-input
                  v-model="form2.address"
                  placeholder="请输入"
                  @keyup.enter.native="getCheckUserInfoBtn"
                />
              </el-form-item>
              <el-form-item
                style="width: 50%; display: inline-block"
                label="账号余额(分)"
              >
                <el-input
                  v-model="form2.accountRemain"
                  placeholder="请输入"
                  @keyup.enter.native="getCheckUserInfoBtn"
                />
              </el-form-item>
              <el-form-item
                prop="smsNumber"
                style="width: 49.4%; display: inline-block"
                label="短信接收号"
              >
                <el-input
                  v-model="form2.smsNumber"
                  placeholder="请输入"
                  @keyup.enter.native="getCheckUserInfoBtn"
                />
              </el-form-item>
            </el-form>
            <div
              class="tipContainer"
              style="
                  margin-top: 10px;
                  padding: 14px 16px;
                  background: #edf3fc;
                "
            >
              <div class="tip"><i class="tipIcon"/> 实名卡说明</div>
              <div class="context">
                为了确保您的账号安全以及提供更优质的服务，我们将进行实名卡验证，即核对您在医院的建档资料。请您配合完成以下步骤：
              </div>
              <div class="stepTitle">1.实名卡验证:</div>
              <div class="context">
                若您已经拥有实名卡，请在账号设置中上传您的实名卡照片，以便我们核对您在医院的身份信息。
              </div>
              <div class="stepTitle">2.手动录入:</div>
              <div class="context">
                若您暂时没有实名卡，你可以选择手动录入与身份证相关的用户信息，请确保提供的信息准确无误，以便我们为您提供更准确的服务。
              </div>
            </div>
          </div>
          <div class="footer">
            <el-button
              type="primary"
              size="medium"
              @click="submitForm('ruleForm')"
            >确认挂号
            </el-button
            >
            <el-button
              type="info"
              size="medium"
              @click="giveUpVisible = true"
            >放弃挂号
            </el-button
            >
          </div>
        </div>
        <!-- 付费方式选择 -->
        <div
          v-else-if="activePageIndex === 3"
          class="AcceptRegistrationBusiness PayWayToChoose"
        >
          <div class="bodyLeft">
            <div
              style="
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                "
            >
              <div class="title">受理挂号业务信息</div>
              <el-button
                type="primary"
                size="medium"
                style="padding: 7px 12px"
                @click="activePageIndex = 2"
              >修改信息
              </el-button
              >
            </div>
            <div class="detailContainer">
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  用户信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">实名卡号
                      </div
                      >
                      <div
                        class="detailInfoContext changeColorRed"
                      >{{ form2.cardNumber }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">身份证号</div>
                      <div
                        class="detailInfoContext changeColorBlue"
                      >{{ form2.idCard }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">用户姓名
                      </div
                      >
                      <div class="detailInfoContext">{{ form2.name }}</div>
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">用户性别</div>
                      <div class="detailInfoContext">{{ form2.sex }}</div>
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">用户年龄
                      </div
                      >
                      <div class="detailInfoContext">{{ form2.age }}</div>
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">联系电话</div>
                      <div class="detailInfoContext">{{ form2.phone }}</div>
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">账号余额(分)
                      </div
                      >
                      <div class="detailInfoContext">{{ form2.accountRemain }}</div>
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">短信接收号</div>
                      <div
                        class="detailInfoContext"
                      >{{ form2.smsNumber }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">联系地址
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ form2.address }}
                      </div
                      >
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div
              style="
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  margin-top: 12px;
                "
            >
              <div class="title">当前选择医院科室信息</div>
              <el-button
                type="primary"
                size="medium"
                style="padding: 7px 12px"
                @click="reSelectDepart"
              >重选科室
              </el-button
              >
            </div>
            <div class="detailContainer">
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  医生信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医院名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ selectHospitalItem.HOSPITALNAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">科室名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ selectDepartItem.DEPTNAME || infoDetail.DEPTNAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">专业名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.SPECIALITYNAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医生姓名
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DOCTORNAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医生职称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DOCTORDEGREE }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号类型
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.SCHEDULETYPENAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医生说明
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DOCTORDESC }}
                      </div
                      >
                    </div>
                  </div>
                </div>
              </div>
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  值班信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">值班日期
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DUTYDATE }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">值班时段</div>
                      <div
                        class="detailInfoContext"
                      >{{
                        infoDetail.DUTYTIME == 1 ? '上午' :
                        infoDetail.DUTYTIME == 2 ? '中午' : infoDetail.DUTYTIME
                        == 3 ? '下午' : infoDetail.DUTYTIME == 4 ? '晚上' : '无'
                      }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">值班星期</div>
                      <div
                        class="detailInfoContext"
                      >{{ handleDataweek(infoDetail.DUTYDATE) }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">值班班次
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.WORKID }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem" style="flex: 2">
                      <div class="detailInfoTitle">剩余号源</div>
                      <div
                        class="detailInfoContext"
                      >{{ surplusNumber }}
                      </div
                      >
                    </div>
                    <!-- <div class="detailInfoItem"></div> -->
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="bodyRight">
            <div
              style="
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                "
            >
              <div class="title">挂号付费方式选择</div>
            </div>
            <el-form
              ref="PayRuleForm"
              :rules="payRules"
              :model="payForm"
              label-width="112px"
              style="margin-top: 20px"
              size="medium"
            >
              <el-form-item label="付费方式" prop="payStyle">
                <el-select
                  v-model="payForm.payStyle"
                  :disabled="true"
                  style="width: 100%"
                  placeholder="请选择"
                >
                  <el-option label="金融通卡" value="0"/>
                  <el-option label="红名单支付" value="1"/>
                  <el-option label="主叫账户" value="2"/>
                  <el-option label="账号余额" value="3"/>
                  <el-option label="医院方扣费" value="4"/>
                  <el-option label="号百IVR支付" value="5"/>
                </el-select>
              </el-form-item>
              <el-form-item
                v-if="payForm.payStyle === '0'"
                label="金融通卡号"
                prop="financeNum"
              >
                <el-input
                  v-model="payForm.financeNum"
                  placeholder="请输入"
                />
              </el-form-item>
              <el-form-item
                v-if="payForm.payStyle === '0'"
                style="width: 50%"
                label="区域"
                prop="area"
              >
                <el-select
                  v-model="payForm.area"
                  style="width: 100%"
                  placeholder="请选择"
                >
                  <el-option label="成都" value="0"/>
                  <el-option label="广州" value="1"/>
                  <el-option label="北京" value="2"/>
                  <el-option label="南京" value="3"/>
                </el-select>
              </el-form-item>
              <el-form-item
                v-if="payForm.payStyle === '0'"
                prop="financeSurplus"
                label="金融通余额"
                style="width: 50%; display: inline-block"
              >
                <el-input
                  v-model="payForm.financeSurplus"
                  placeholder="请输入"
                />
              </el-form-item>
              <el-form-item
                v-if="payForm.payStyle === '0'"
                label-width="6px"
                style="width: 49.4%; display: inline-block"
              >
                <el-button
                  type="primary"
                  plain
                  size="medium"
                >查询余额
                </el-button
                >
                <el-button
                  type="primary"
                  plain
                  size="medium"
                >电话充帐
                </el-button
                >
              </el-form-item>
              <el-form-item
                v-if="payForm.payStyle === '2'"
                prop="caller"
                label="当前主叫"
                style="width: 50%; display: inline-block"
              >
                <el-input
                  v-model="payForm.caller"
                  placeholder="请输入"
                />
              </el-form-item>
              <el-form-item
                v-if="payForm.payStyle === '2'"
                prop="accountRemain"
                label="账户余额(分)"
                style="width: 49.4%; display: inline-block"
              >
                <el-input
                  v-model="payForm.accountRemain"
                  placeholder="请输入"
                />
              </el-form-item>
              <el-form-item
                v-if="payForm.payStyle === '5'"
                label="付费类型"
                prop="expenseStyle"
              >
                <el-select
                  v-model="payForm.expenseStyle"
                  style="width: 100%"
                  placeholder="请选择"
                >
                  <el-option label="预约服务费+挂号费" value="0"/>
                  <el-option label="红名单支付" value="1"/>
                </el-select>
              </el-form-item>
            </el-form>
            <div
              class="tipContainer"
              style="
                  margin-top: 10px;
                  padding: 14px 16px;
                  background: #edf3fc;
                "
            >
              <div class="tip"><i class="tipIcon"/> 付费方式说明</div>
              <div class="context">
                目前，我们仅支持医院方付费方式。这意味着，在您成功预约后，您需要前往医院的付费窗口进行付款手续。请您注意以下操作流程：
              </div>
              <div class="stepTitle">步骤一:</div>
              <div class="context">完成在线预约后，系统会生成预约凭证。</div>
              <div class="stepTitle">步骤二:</div>
              <div class="context">
                请携带预约凭证前往医院，前往付费窗口进行付款。
              </div>
              <div class="stepTitle">步骤三:</div>
              <div class="context">
                在付费窗口出示您的预约凭证，完成付款手续。
              </div>
              <div class="context">
                付费详情：有关付费金额以及具体的费用，请您在预约时查阅相关信息。
              </div>
            </div>
          </div>
          <div class="footer">
            <el-button
              :loading="loadingList.loading2"
              type="primary"
              size="medium"
              @click="submitPayForm('PayRuleForm')"
            >确认支付
            </el-button
            >
            <el-button
              type="info"
              size="medium"
              @click="giveUpVisible = true"
            >放弃支付
            </el-button
            >
          </div>
        </div>
        <!-- 返回结果信息 -->
        <div v-if="activePageIndex === 4" class="returnResult">
          <div>
            <el-result v-if="resultSuccess" icon="success" title="挂号成功">
              <template slot="extra">
                <div class="contextDetail">
                  系统将会生成用户的挂号信息并保存在本地，可点击<span
                    class="contextOper"
                  >【挂号详情】</span
                  >
                  按钮查询挂号结果
                </div>
                <div class="resultBtn">
                  <el-button type="primary" size="medium" @click="goLocalDetail">挂号详情</el-button>
                  <el-button
                    type="info"
                    size="medium"
                    @click="endRegister"
                  >结束挂号
                  </el-button
                  >
                </div>
              </template>
            </el-result>
            <el-result v-else icon="error" title="挂号失败">
              <template slot="extra">
                <div class="contextDetail">
                  挂号医院<span
                    class="contextOper"
                  >【{{ selectHospitalItem.HOSPITALNAME }}】</span
                  >
                  <br>
                  {{ errorTip }}
                </div>
                <div class="resultBtn">
                  <el-button
                    type="primary"
                    size="medium"
                    @click="reSelectDepart"
                  >重新挂号
                  </el-button
                  >
                </div>
              </template>
            </el-result>
          </div>
          <div class="resultDetail">
            <div class="title">挂号结果详情</div>
            <div class="detailContainer">
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  挂号结果信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号流水
                      </div
                      >
                      <div class="detailInfoContext">{{ registrationResult.WORKFLOWID }}</div>
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号密码</div>
                      <div class="detailInfoContext">{{ registrationResult.SCHEDULEPASSWORD }}</div>
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">就诊日期</div>
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DUTYDATE }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">就诊时间
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ registrationResult.VISITTIME }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">排队号签</div>
                      <div class="detailInfoContext">{{ registrationResult.SERIALNUM }}</div>
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">取号时间</div>
                      <div
                        class="detailInfoContext"
                      >{{ registrationResult.TAKETIME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">取号地点
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ registrationResult.TAKEADD }}
                      </div
                      >
                    </div>
                  </div>
                </div>
              </div>
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  用户信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">用户姓名
                      </div
                      >
                      <div class="detailInfoContext">{{ form2.name }}</div>
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">身份号码</div>
                      <div class="detailInfoContext">{{ form2.idCard }}</div>
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">实名卡号</div>
                      <div
                        class="detailInfoContext"
                      >{{ form2.cardNumber }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">用户年龄
                      </div
                      >
                      <div class="detailInfoContext">{{ form2.age }}</div>
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">用户性别</div>
                      <div class="detailInfoContext">{{ form2.sex }}</div>
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">联系电话</div>
                      <div class="detailInfoContext">{{ form2.phone }}</div>
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">联系地址
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ form2.address }}
                      </div
                      >
                    </div>
                  </div>
                </div>
              </div>
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  医院信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医院名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ selectHospitalItem.HOSPITALNAME }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">科室名称</div>
                      <div
                        class="detailInfoContext"
                      >{{ selectDepartItem.DEPTNAME || infoDetail.DEPTNAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">专业名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.SPECIALITYNAME }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医院姓名</div>
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DOCTORNAME }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医生职称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.DOCTORDEGREE }}
                      </div
                      >
                    </div>
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号类型
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ infoDetail.SCHEDULETYPENAME }}
                      </div
                      >
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- 本地挂号信息 -->
    <div
      v-else-if="activeIndex === '2'"
      class="pageBody localRegistrationInfo"
    >
      <div class="localBodyLeft">
        <div class="title titleInfo">查询用户挂号信息</div>
        <el-form
          ref="formLocal"
          :inline="true"
          :model="formLocal"
          style="margin-top: 20px; padding-left: 10px;margin-left: -40px;"
          label-position="right"
          label-width="110px"
          class="localFormClass"
        >
          <el-row>
            <el-col :span="6">
              <el-form-item label="挂号医院">
                <el-select
                  v-scroll="handleScroll3"
                  ref="hospitalSelectName3"
                  v-model="formLocal.hospitalNo"
                  :filter-method="filterFn3"
                  filterable
                  clearable
                  size="medium"
                  style="width: 100%"
                  placeholder="输入中文/简拼"
                  @change="selectHospotalFn3"
                  @visible-change="isShowMenu3"
                  @clear="clearSelectFn3"
                >
                  <el-option
                    v-for="item in localHospitalList"
                    :label="item.HOSPITALNAME "
                    :key="item.HOSPITALNO"
                    :value="item.HOSPITALNO"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="开始时间" class="margin-pub">
                <el-date-picker
                  v-model="formLocal.date1"
                  :clearable="false"
                  type="datetime"
                  format="yyyy-MM-dd HH:mm:ss"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  size="medium"
                  placeholder="选择日期"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="结束时间" class="margin-pub">
                <el-date-picker
                  v-model="formLocal.date2"
                  :clearable="false"
                  size="medium"
                  format="yyyy-MM-dd HH:mm:ss"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  type="datetime"
                  style="width: 100%"
                  placeholder="选择日期"
                  default-time="23:59:59"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="医生姓名" class="margin-pub">
                <el-input
                  v-model="formLocal.doctorName"
                  style="width: 100%"
                  size="medium"
                  placeholder="请输入"
                  @keyup.enter.native="onSubmit4"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="用户姓名" class="margin-pub">
                <el-input
                  v-model="formLocal.userName"
                  style="width: 100%"
                  size="medium"
                  placeholder="请输入"
                  @keyup.enter.native="onSubmit4"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="查询条件" class="margin-pub">
                <el-select
                  ref="searchPrerequisite"
                  :style="{ 'margin-right': '2px', width: formLocal.type ? '40%' : '100%' }"
                  v-model="formLocal.type"
                  size="medium"
                  placeholder="请选择"
                  @change="selectChangeFn"
                >
                  <el-option label="全部" value=""/>
                  <el-option label="主叫号码" value="1"/>
                  <el-option label="实名卡号" value="2"/>
                  <el-option label="就诊日期" value="3"/>
                  <el-option label="科室名称" value="4"/>
                  <el-option label="身份证号码" value="5"/>
                  <el-option label="挂号状态" value="6"/>
                </el-select>
                <el-input
                  v-if="formLocal.type === '1'"
                  v-model="formLocal.caller"
                  style="width: calc(60% - 7px)"
                  size="medium"
                  placeholder="请输入"
                  @keyup.enter.native="onSubmit4"
                />
                <el-input
                  v-if="formLocal.type === '2'"
                  v-model="formLocal.hospitalCard"
                  style="width: calc(60% - 7px)"
                  size="medium"
                  placeholder="请输入"
                  @keyup.enter.native="onSubmit4"
                />
                <el-input
                  v-if="formLocal.type === '4'"
                  v-model="formLocal.deptName"
                  style="width: calc(60% - 7px)"
                  size="medium"
                  placeholder="请输入"
                  @keyup.enter.native="onSubmit4"
                />
                <el-input
                  v-if="formLocal.type === '5'"
                  v-model="formLocal.useridCard"
                  style="width: calc(60% - 7px)"
                  size="medium"
                  placeholder="请输入"
                  @keyup.enter.native="onSubmit4"
                />
                <el-select
                  v-if="formLocal.type === '6'"
                  v-model="formLocal.status"
                  style="width: calc(60% - 7px)"
                  size="medium"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="op in registeredStatus"
                    :key="op.value"
                    :label="op.label"
                    :value="op.value"
                  />
                </el-select>
                <el-date-picker
                  v-if="formLocal.type === '3'"
                  v-model="formLocal.scheduleDate"
                  type="date"
                  format="yyyy-MM-dd"
                  value-format="yyyy-MM-dd"
                  size="medium"
                  placeholder="选择日期"
                  style="width: calc(60% - 7px)"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item class="localInputBtn" style="padding-left: 40px;">
                <el-button
                  type="primary"
                  size="medium"
                  @click="onSubmit4"
                >查询
                </el-button
                >
                <el-button type="info" size="medium" @click="repeatForm4">重置</el-button>
                <el-button v-if="debugFlag" type="info" size="medium" @click="localCallResult = true">callResult
                </el-button>

              </el-form-item>
            </el-col>

          </el-row>
        </el-form>
        <div class="localSingleTableContainer">
          <el-table
            ref="localSingleTable"
            :data="localTableData"
            :header-cell-style="headerCellStyle"
            highlight-current-row
            height="100%"
            style="width: 100%;height: 100%;overflow: auto;"
            @current-change="localSelectFn"
          >
            <el-table-column min-width="120px" fixed="left" show-overflow-tooltip label="当前状态">
              <template slot-scope="scope">
                <span
                  :style="(scope.row.STATUS == '8' || scope.row.STATUS == '0') ?'color:#1a7ef2':'color:#ee4822'">{{
                    handleStateFn(scope.row.STATUS)
                  }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="80px" fixed="left" show-overflow-tooltip label="用户姓名">
              <template slot-scope="scope">
                <span>{{ encryptPublic(scope.row.USERNAME, 'name') || '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="170px" show-overflow-tooltip align="center" label="身份证号">
              <template slot-scope="scope">
                <span>{{ encryptPublic(scope.row.USERIDCARD, 'idcard') || '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="80px" show-overflow-tooltip align="center" prop="USERAGE" label="用户年龄">
              <template slot-scope="scope">
                <span>{{ scope.row.USERAGE ? scope.row.USERAGE : '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="80px" show-overflow-tooltip align="center" label="用户性别">
              <template slot-scope="scope">
                <span>{{ scope.row.USERSEX == '1' ? '男' : '女' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="180px" show-overflow-tooltip prop="HOSPITALNAME" label="医院名称">
              <template slot-scope="scope">
                <span>{{ scope.row.HOSPITALNAME ? scope.row.HOSPITALNAME : '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="140px" show-overflow-tooltip prop="DEPARTMENTNAME" label="科室名称">
              <template slot-scope="scope">
                <span>{{ scope.row.DEPARTMENTNAME ? scope.row.DEPARTMENTNAME : '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="80px" show-overflow-tooltip prop="DOCTORNAME" label="医生姓名">
              <template slot-scope="scope">
                <span>{{ scope.row.DOCTORNAME ? scope.row.DOCTORNAME : '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="120px" show-overflow-tooltip label="主叫号码">
              <template slot-scope="scope">
                <span>{{ encryptPublic(scope.row.CURRENTCALLER, 'phone') || '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="150px" show-overflow-tooltip prop="AGENTNO" label="挂号工号">
              <template slot-scope="scope">
                <span>{{ scope.row.AGENTNO ? scope.row.AGENTNO : '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="150px" show-overflow-tooltip align="center" prop="CREATEDATE" label="挂号时间">
              <template slot-scope="scope">
                <span>{{ scope.row.CREATEDATE ? scope.row.CREATEDATE : '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="120px" show-overflow-tooltip prop="CHANGEAGENTNO" label="取消工号">
              <template slot-scope="scope">
                <span>{{ scope.row.CHANGEAGENTNO.trim() ? scope.row.CHANGEAGENTNO : '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="150px" show-overflow-tooltip align="center" prop="CHANGEDATE" label="取消时间">
              <template slot-scope="scope">
                <span>{{ scope.row.CHANGEDATE.trim() ? scope.row.CHANGEDATE : '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="120px" show-overflow-tooltip prop="STATUSDESC" label="取消原因">
              <template slot-scope="scope">
                <span>{{ scope.row.STATUSDESC ? scope.row.STATUSDESC : '--' }}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="180px" show-overflow-tooltip prop="WORKFLOWID" label="挂号流水">
              <template slot-scope="scope">
                <span>{{ scope.row.WORKFLOWID ? scope.row.WORKFLOWID : '--' }}</span>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <el-pagination
          :current-page="localCurrentPage"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="localCurrentSize"
          :total="searchLocalTotal"
          style="
            position: absolute;
            bottom: 3px;
            left: 7px;
            right: 0;
            padding: 5px 4px;
            background: #f6f6f7;
          "
          background
          layout=" prev, pager, next, jumper, total, sizes"
          @size-change="localSizeChange"
          @current-change="localCurrentChange"
        />
      </div>
      <div :class="isSpread ? 'spread ':'shrink'" class="localBodyRight">
        <div class="title">
          用户挂号详情
        </div>
        <div style="height: calc(100% - 21px); overflow: auto;padding-bottom: 10px;">
          <div>
            <div style="font-size: 14px;font-weight: bold;margin: 17px 0 -6px 10px;">当前状态：<span
              :style="(rowDataDetail.STATUS == '8' || rowDataDetail.STATUS == '0')?'color:#1a7ef2;font-weight: normal':'color:#ee4822;font-weight: normal'">{{
                handleStateFn(rowDataDetail.STATUS)
              }}</span>
            </div>
            <div class="detailContainer">
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  用户信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">用户姓名
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ encryptPublic(rowDataDetail.USERNAME, 'name') || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">身份证号
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ encryptPublic(rowDataDetail.USERIDCARD, 'idcard') || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">实名卡号
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.HOSPITALCARD || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">用户年龄
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.USERAGE || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">用户性别
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.USERSEX == '1' ? '男' : rowDataDetail.USERSEX == '2' ? '女' : "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">联系电话
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ encryptPublic(rowDataDetail.USERTEL, 'phone') || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">联系地址
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.USERADDRESS || "无" }}
                      </div
                      >
                    </div>
                  </div>
                </div>
              </div>
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  医生信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医院名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.HOSPITALNAME || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">科室名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.DEPARTMENTNAME || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">专业名称
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.SPECIALITYNAME || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医生姓名
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.DOCTORNAME || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <!-- <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医生职称</div
                      ><div class="detailInfoContext"
                        >{{ "无" }}</div
                      >
                    </div>
                  </div> -->
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号类型
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.SCHEDULETYPENAME || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <!-- <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号费用</div
                      ><div class="detailInfoContext"
                        >{{ "无" }}</div
                      >
                    </div>
                  </div> -->
                  <!-- <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">医生说明</div
                      ><div class="detailInfoContext"
                        >{{ "无" }}</div
                      >
                    </div>
                  </div> -->
                </div>
              </div>
              <div class="detailItem">
                <div>
                  <span class="detailInfoContanierTitle"/>
                  就诊信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号时间
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.CREATEDATE || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">就诊日期
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.SCHEDULEDATE || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">就诊时间
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{
                        rowDataDetail.SCHEDULETIME == '1' ? '上午' : rowDataDetail.SCHEDULETIME == '2' ? '中午' : rowDataDetail.SCHEDULETIME == 3 ? '下午' : rowDataDetail.SCHEDULETIME == 4 ? '晚上' : '无'
                      }}
                      </div
                      >
                    </div>
                  </div>
                  <!-- <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">排队号签</div
                      ><div class="detailInfoContext"
                        >{{ "无" }}</div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">取号时间</div
                      ><div class="detailInfoContext"
                        >{{ "无" }}</div
                      >
                    </div>
                  </div> -->
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">预约信息
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.OTHERINFO || "无" }}
                      </div
                      >
                    </div>
                  </div>
                </div>
              </div>
              <div class="detailItem">
                <div>
                  <div class="detailInfoContanierTitle"/>
                  其他信息
                </div>
                <div class="detailInfoContanier">
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">主叫号码
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ encryptPublic(rowDataDetail.CURRENTCALLER, 'phone') || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号工号
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.AGENTNO?.trim() || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <!-- <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号时间</div
                      ><div class="detailInfoContext"
                        >{{ rowDataDetail.CREATEDATE || "无" }}</div
                      >
                    </div>
                  </div> -->
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">取消工号
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.CHANGEAGENTNO?.trim() || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">取消时间
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.CHANGEDATE?.trim() || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">取消原因
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.STATUSDESC?.trim() || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">挂号流水
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.WORKFLOWID?.trim() || "无" }}
                      </div
                      >
                    </div>
                  </div>
                  <div class="detailInfoContanierItem">
                    <div class="detailInfoItem">
                      <div class="detailInfoTitle">是否通知
                      </div
                      >
                      <div
                        class="detailInfoContext"
                      >{{ rowDataDetail.USERNOTICE == '1' ? '已通知' : '未通知' || "无" }}
                      </div
                      >
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <i :class="isSpread ? 'btn_retract':'btn_open'" class="btnIcon" @click="isSpreadFn"/>
        <div v-if="rowDataDetail.STATUS != '-1'" class="operBtnContainer">
          <el-button :disabled="rowDataDetail.STATUS != '0'" type="danger" size="medium" @click="giveUpRegFnBtn">
            取消挂号
          </el-button>
          <el-button type="primary" size="medium" @click="repeatSendMessageBtn">重发短信</el-button>
          <el-button
            :disabled="rowDataDetail.USERNOTICE == '1'"
            :loading="loadingList.setUserNoticeMsg"
            type="primary"
            size="medium"
            @click="setUserNotice">标识已通知
          </el-button>
        </div>
      </div>
    </div>
    <!-- HIS系统挂号信息 -->
    <div v-if="activeIndex === '3'" class="pageBody medicalCardAppointment">
      <div style="margin-top: 15px;">
        <div style="display: inline-block;" class="title titleInfo">查询医疗卡预约信息</div>
        <div style="display: inline-block;border-radius: 5px;margin-left: 15px;padding: 5px 9px;background: #edf3fc;"><i
          style="position: relative;top: 2px;"
          class="tipIcon"/><span
            style="color: #1a7ef2; font-size: 16px;font-family: 'SourceHanSansCN';font-weight: bold;margin-right: 20px;">温馨提示</span><span
              style="color: #666a6f; font-size: 14px;font-family: 'SourceHanSansCN Regular';">1.目前只支持查询华西医院和华西温江分院；2.默认就诊时间条件为空，即查询当前所有有效的预约记录。</span>
        </div>
      </div>
      <el-form
        :inline="true"
        :model="medicalForm"
        style="margin-top: 18px; padding-left: 10px;margin-bottom: 13px;"
        label-position="right"
        label-width="90px"
      >
        <el-form-item label="挂号医院" label-width="73px">
          <el-select
            v-scroll="handleScroll2"
            ref="hospitalSelectName2"
            v-model="medicalForm.hospitalNo"
            :filter-method="filterFn2"
            filterable
            clearable
            size="medium"
            style="width: 230px"
            placeholder="输入中文/简拼"
            @clear="clearSelectFn2"
            @change="selectHospotalFn2"
            @visible-change="isShowMenu2"
          >
            <el-option
              v-for="item in medicalHospitalList"
              :label="item.HOSPITALNAME "
              :key="item.HOSPITALNO"
              :value="item.HOSPITALNO"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="就诊日期" class="margin-pub">
          <el-date-picker
            v-model="medicalForm.date1"
            type="date"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            size="medium"
            placeholder="选择日期"
            style="width: 185px"
          />
        </el-form-item>
        <el-form-item label="实名卡号" class="margin-pub">
          <el-input
            v-model="medicalForm.offices"
            style="width: 220px"
            size="medium"
            placeholder="请输入"
          />
        </el-form-item>

        <el-form-item>
          <el-button
            type="primary"
            size="medium"
            @click="onSubmit5"
          >查询
          </el-button
          >
          <el-button type="info" size="medium" @click="resetMedicalForm">重置</el-button>
          <el-button v-if="debugFlag" type="info" size="medium" @click="MeResultMsg = true">callResult</el-button>
        </el-form-item>
      </el-form>
      <div class="medicalTableContainer" style="padding-left: 15px; overflow: hidden;">
        <el-table
          ref="medicalTableData"
          :data="medicalTableData"
          :header-cell-style="headerCellStyle"
          style="height: 100%; width: 100%; overflow: auto;"
          height="100%"
        >
          <el-table-column prop="UserName" min-width="80px" show-overflow-tooltip label="用户姓名"/>
          <el-table-column prop="HospitalCard" min-width="80px" show-overflow-tooltip label="实名卡号"/>
          <el-table-column prop="HospitalName" min-width="80px" show-overflow-tooltip label="医院名称"/>
          <el-table-column
            prop="DepartmentName"
            min-width="80px"
            show-overflow-tooltip
            label="科室名称"/>
          <el-table-column prop="DoctorName" min-width="80px" show-overflow-tooltip label="医生姓名"/>
          <el-table-column prop="VisitTime" min-width="80px" show-overflow-tooltip label="就诊时间"/>
          <el-table-column min-width="80px" show-overflow-tooltip label="就诊时段">
            <template slot-scope="scope">
              <span>{{
                scope.row.ScheduleTime == '1' ? '上午' : scope.row.ScheduleTime == '2' ? '中午' : scope.row.ScheduleTime == '3' ? '下午' : '晚上'
              }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="SerialNum" min-width="80px" show-overflow-tooltip label="就诊号签"/>
          <el-table-column prop="TakeTime" min-width="80px" show-overflow-tooltip label="取号时间"/>
          <el-table-column prop="TakeAdd" min-width="80px" show-overflow-tooltip label="取号地点"/>
          <el-table-column prop="RegFee" min-width="80px" show-overflow-tooltip label="挂号费"/>
          <el-table-column prop="ServFee" min-width="80px" show-overflow-tooltip label="服务费"/>
          <el-table-column
            prop="WorkFlowId"
            min-width="100px"
            show-overflow-tooltip
            label="预约记录ID"/>
        </el-table>
      </div>
    </div>
    <!-- 医疗挂号 医院公告弹框 -->
    <el-dialog
      :visible.sync="dialogVisible"
      custom-class="selfDialog"
      title="医院公告"
      width="600px"
    >
      <div
        style="padding-top: 4px"
        v-html="selectHospitalItem.RECENTMEMOINFO"
      />
      <span slot="footer" style="text-align: center" class="dialog-footer">
        <el-button
          size="medium"
          style="padding: 7px 12px"
          type="primary"
          @click="dialogVisible = false"
        >我已知晓</el-button
        >
      </span>
    </el-dialog>
    <!-- 医疗挂号 放弃挂号或支付弹框 -->
    <el-dialog
      ref="selfDialog"
      :visible.sync="giveUpVisible"
      :title="activePageIndex === 2 ?'放弃挂号': '放弃支付'"
      custom-class="selfDialog"
      width="460px"
    >
      <div
        style="
            padding: 20px 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            font-family: 'SourceHanSansCN Regular';
          "
      >
        <div
          style="
              font-size: 16px;
              color: #031223;
              font-weight: bold;
              margin-bottom: 10px;
            "
        >
          {{ activePageIndex === 2 ? "是否放弃挂号？" : "是否放弃支付？" }}
        </div>
        <div style="color: #666a6f; font-size: 14px">
          {{
            activePageIndex === 2 ?
              "放弃后将返回医院科室信息页面，请谨慎操作！" :
              "放弃后将挂号失败，返回医院科室信息页面，请谨慎操作！"
          }}
        </div>
      </div>
      <span slot="footer" style="text-align: center" class="dialog-footer">
        <el-button
          size="medium"
          type="primary"
          @click="giveUpOper"
        >放弃</el-button
        >
        <el-button
          size="medium"
          type="info"
          @click="giveUpVisible = false"
        >取消</el-button
        >
      </span>
    </el-dialog>
    <!-- 取消挂号 -->
    <el-dialog
      :visible.sync="giveUpRegistration"
      custom-class="selfDialog"
      title="取消挂号"
      width="460px"
    >
      <div
        style="
            padding: 20px 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            font-family: 'SourceHanSansCN Regular';
          "
      >
        <div
          style="
              font-size: 16px;
              color: #031223;
              font-weight: bold;
              margin-bottom: 10px;
            "
        >
          是否放弃挂号？
        </div>
        <div style="color: #666a6f; font-size: 14px">
          频繁取消挂号将影响挂号服务，请谨慎操作！
        </div>
      </div>
      <span slot="footer" style="text-align: center" class="dialog-footer">
        <el-button
          :loading="loadingList.cancelRegistrationMsg"
          size="medium"
          type="primary"
          @click="giveUpRegFn"
        >确定取消挂号</el-button
        >
        <el-button
          size="medium"
          type="info"
          @click="giveUpRegistration = false"
        >取消</el-button
        >
      </span>
    </el-dialog>
    <!-- 重发短信 -->
    <el-dialog
      v-drag
      :visible.sync="repeatSendMessage"
      custom-class="selfDialog"
      title="重发短信"
      width="600px"
    >
      <div style="padding: 26px 20px 0;font-family: 'SourceHanSansCN Regular';">
        <el-form ref="formSms" :rules="smsRules" :model="formSms" class="formSms">
          <el-form-item label="短信接收号码" label-width="110px" prop="phone">
            <el-input v-model="formSms.phone" placeholder="请输入" autocomplete="off"/>
          </el-form-item>
          <el-form-item label="短信内容" label-width="110px" prop="context">
            <el-input
              :rows="6"
              v-model="formSms.context"
              type="textarea"
              placeholder="请输入"
              autocomplete="off"/>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" style="text-align: center" class="dialog-footer">
        <el-button
          :loading="loadingList.heavyMessagesMsg"
          size="medium"
          type="primary"
          @click="repeatSendMessageFn('formSms')"
        >发送</el-button
        >
        <el-button
          size="medium"
          type="info"
          @click="repeatSendMessage = false"
        >取消</el-button
        >
      </span>
    </el-dialog>
    <!-- 快捷键提示 -->
    <el-dialog
      :visible.sync="keyBoardTipMsg"
      custom-class="selfDialog"
      title="快捷键"
      width="600px"
    >
      <div style="padding-top: 4px" class="keyBoardContainer">
        <div class="detailContainer">
          <div class="detailItem" style="margin-top: 0;">
            <div>
              <span class="detailInfoContanierTitle"/>
              医院科室信息
            </div>
            <div class="detailInfoContanier">
              <div class="detailInfoContanierItem">
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">按医院查询</span
                  ><span
                    class="detailInfoContext"
                  >F1</span
                  >
                </div>
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">按科室查询</span>
                  <span
                    class="detailInfoContext"
                  >F2</span
                  >
                </div>
              </div>
              <div class="detailInfoContanierItem">
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">医院科室检索</span
                  ><span
                    class="detailInfoContext"
                  >Enter</span
                  >
                </div>
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">排班信息检索</span>
                  <span
                    class="detailInfoContext"
                  >Enter</span
                  >
                </div>
              </div>
              <div class="detailInfoContanierItem">
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">切换排班数据</span
                  ><span
                    class="detailInfoContext"
                  >上下箭头</span
                  >
                </div>
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">表格分页跳转</span
                  ><span
                    class="detailInfoContext"
                  >Enter</span
                  >
                </div>

              </div>
              <div class="detailInfoContanierItem">
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">确定选择此科室，并开始挂号</span
                  ><span
                    class="detailInfoContext"
                  >空格键</span
                  >
                </div>
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">表格分页</span
                  ><span
                    class="detailInfoContext"
                  >左右箭头</span
                  >
                </div>
              </div>
            </div>
          </div>
          <div class="detailItem">
            <div>
              <span class="detailInfoContanierTitle"/>
              受理挂号业务
            </div>
            <div class="detailInfoContanier">
              <div class="detailInfoContanierItem">
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">查询用户</span>
                  <span
                    class="detailInfoContext"
                  >Enter</span
                  >
                </div>
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">切换上个步骤</span
                  ><span
                    class="detailInfoContext"
                  >左箭头</span
                  >
                </div>
              </div>
              <div class="detailInfoContanierItem">
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">确认挂号</span
                  ><span
                    class="detailInfoContext"
                  >空格键</span
                  >
                </div>
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">放弃挂号</span>
                  <span class="detailInfoContext">Esc键</span>
                </div>
              </div>
              <div class="detailInfoContanierItem">
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">光标切换至下一个输入框</span>
                  <span
                    class="detailInfoContext"
                  >Tab键</span
                  >
                </div>
              </div>
            </div>
          </div>
          <div class="detailItem">
            <div>
              <span class="detailInfoContanierTitle"/>
              付费方式选择
            </div>
            <div class="detailInfoContanier">
              <div class="detailInfoContanierItem">
                <!-- <div class="detailInfoItem">
                    <span class="detailInfoTitle">查询余额</span>
                    <span class="detailInfoContext"
                      >Enter</span
                    >
                  </div> -->
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">确认支付</span>
                  <span
                    class="detailInfoContext"
                  >空格键</span
                  >
                </div>
                <div class="detailInfoItem">
                  <span class="detailInfoTitle">放弃支付</span
                  ><span
                    class="detailInfoContext"
                  >Esc键</span
                  >
                </div>
              </div>
              <div class="detailInfoContanierItem">

                <div class="detailInfoItem">
                  <span class="detailInfoTitle">切换上个步骤</span>
                  <span class="detailInfoContext">左箭头</span>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" style="text-align: center" class="dialog-footer">
        <el-button
          size="medium"
          style="padding: 7px 12px"
          type="primary"
          @click="keyBoardTipMsg = false"
        >我已知晓</el-button
        >
      </span>
    </el-dialog>
    <el-dialog :visible.sync="callResultMsg" title="callResult" width="500px">
      <el-form :model="form55">
        <el-form-item label="callResult">
          <el-input v-model="form55.callResult"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="callResultMsg = false">取 消</el-button>
        <el-button type="primary" @click="getCheckUserInfo">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog :visible.sync="MeResultMsg" title="callResult" width="500px">
      <el-form :model="form55">
        <el-form-item label="callResult">
          <el-input v-model="form55.MeResultMsg"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="MeResultMsg = false">取 消</el-button>
        <el-button type="primary" @click="MeResultMsg = false">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="numCallResult" title="callResult" width="500px">
      <el-form :model="form55">
        <el-form-item label="callResult">
          <el-input v-model="form55.numResultMsg"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="numCallResult = false">取 消</el-button>
        <el-button type="primary" @click="numCallResult = false">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="localCallResult" title="callResult" width="500px">
      <el-form :model="form55">
        <el-form-item label="callResult">
          <el-input v-model="form55.localResultMsg"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="localCallResult = false">取 消</el-button>
        <el-button type="primary" @click="localCallResult = false">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<style>
[v-cloak] {
  display: none;
}
</style>
<script>
import axios from 'axios'
import RegisterationDao from '@/api/RegisterationDao'

export default {
// var app = new Vue({
//   name: 'App',
  directives: {
    // dialog可拖拽
    drag: {
      bind: function(el, binding) {
        console.log(el, 666)
        // 获取弹框元素
        var dialog = el.querySelector('.selfDialog')
        console.log('dialog', dialog)
        // 定义变量记录鼠标按下时的位置和弹框的初始位置
        var mouseX, mouseY, dialogX, dialogY
        var isMouseDown = false // 是否处于长按状态

        // 绑定鼠标按下事件
        dialog.addEventListener('mousedown', function(event) {
          isMouseDown = true
          // 记录鼠标按下时的位置和弹框的初始位置
          mouseX = event.pageX
          mouseY = event.pageY
          dialogX = parseInt(window.getComputedStyle(dialog).left)
          dialogY = parseInt(window.getComputedStyle(dialog).top)
          // 绑定鼠标移动和鼠标松开事件
          document.addEventListener('mousemove', onMouseMove)
          document.addEventListener('mouseup', onMouseUp)
        })

        // 鼠标移动事件处理函数
        function onMouseMove(event) {
          if (isMouseDown) { // 判断是否处于长按状态
            dialog.style.cursor = 'move' // 将鼠标的样式设置为“可拖拽”
          }
          // 计算鼠标移动的距离
          var deltaX = event.pageX - mouseX
          var deltaY = event.pageY - mouseY
          // 更新弹框的位置
          dialog.style.left = dialogX + deltaX + 'px'
          dialog.style.top = dialogY + deltaY + 'px'
        }

        // 鼠标松开事件处理函数
        function onMouseUp(event) {
          // 解绑鼠标移动和鼠标松开事件
          isMouseDown = false
          dialog.style.cursor = '' // 将鼠标的样式恢复为默认值
          document.removeEventListener('mousemove', onMouseMove)
          document.removeEventListener('mouseup', onMouseUp)
        }
      }
    },
    scroll: {
      // 指令的定义
      bind: function(el, binding) {
        const scrollDom = el.querySelector(
          '.el-select-dropdown .el-select-dropdown__wrap'
        )
        scrollDom.addEventListener('scroll', function() {
          const condition =
            this.scrollHeight - this.scrollTop <= this.clientHeight
          if (condition) {
            binding.value()
          }
        })
      }
    },
    focus: {
      // 当被绑定的元素插入到 DOM 中时……
      inserted: function(el) {
        // 聚焦元素
        el.children[0].focus()
        // el.focus();
      }
    },
    onfocus: {
      // 当被绑定的元素插入到 DOM 中时……
      inserted: function(el) {
        // 聚焦元素
        // console.log(el.children[0].children[1],'el')
        el.children[0].children[1].focus()
        el.children[0].children[1].blur()
      }
    }
  },
  data() {
    return {
      url: '${ctxPath}/yq-hospital-mgr/webcall?action=',
      // url: "/yq-hospital-mgr/webcall?action=",
      // huaXiHospitalIdOld: '<%=huaXiHospitalIdOld%>',
      // huaXiHospitalIdNew: '<%=huaXiHospitalIdNew%>',
      // huaXiHospitalId: '<%=huaXiHospitalId%>',
      // extendsKeyValueInfo: '<%=extendsKeyValueInfo%>',
      // activeIndex: '1', // 大页面步骤 ‘1’开始
      // activePageIndex: 1, // 医院科室信息步骤 1开始
      // called: '${param.called}',
      // caller: '${param.caller}',
      // callId: '${param.callId}',
      // agentId: '${param.agentId}',
      // agentNo: '${param.agentNo}',
      // debugFlag: '<%=debugFlag%>' === 'true', // debugFlag字符串转化为boolean
      huaXiHospitalIdOld: '1234',
      huaXiHospitalIdNew: '1234',
      huaXiHospitalId: '1234',
      extendsKeyValueInfo: '@@@',
      activeIndex: '1', // 大页面步骤 ‘1’开始
      activePageIndex: 1, // 医院科室信息步骤 1开始
      called: '1234',
      caller: '1234',
      callId: '1234',
      agentId: '1234',
      agentNo: '1233',
      debugFlag: 'true', // debugFlag字符串转化为boolean
      // called: "6000206",
      // caller: "6000206",
      // callId: "5057",
      // agentId: "5057",
      // agentNo: '8001',
      // debugFlag: false,
      // selectHospitalItem: {
      //   // 假设这是你原本的数据结构
      //   RECENTMEMOINFO: '' // 初始化为空字符串或其他默认值
      // },
      hospitalPageIndex: 1,
      hospitalPageSize: 10,
      isHasHospital: true,
      userMark: {},
      userPhoneMeal: [],
      hospitalNo: '', // 医院编号
      deptNo: '', // 科室编号
      surplusNumber: 0,
      tableSelectIndex: 0,
      medicalTableData: [],
      keyBoardTipMsg: false,
      formInline: {
        DepartmentName: '',
        hospitalNo: '',
        date1: '',
        searchStyle: '按医院'
      },
      form: {
        name: '', // 医生关键字
        style: '', // 挂号类型关键字
        offices: '', // 科室/专业关键字
        date1: '', // 排班开始日期
        date2: '' // 排班结束日期
      },
      formLocal: {
        hospitalNo: '', // 医生关键字
        hospitalName: '',
        doctorName: '',
        userName: '',
        date1: '', // 开始时间
        date2: '', // 结束时间
        type: '',
        status: '',
        caller: '${param.caller}',
        // caller: "6000206",
        hospitalCard: '',
        deptName: '',
        useridCard: '',
        scheduleDate: ''
      },
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 8.64e7
        }
      },
      lineDuty: '',
      lineDutyTotal: '',
      lineDutyPageIndex: 1,
      lineDutyPageSize: 10,
      hospitalType: 1,
      form2: {
        cardNumber: '',
        idCard: '',
        name: '',
        userId: '',
        userCode: '',
        blackPat: '',
        sex: '男',
        age: '',
        phone: '',
        address: '',
        accountRemain: '',
        smsNumber: '',
        userIdKey: ''
      },
      formSms: {
        phone: '',
        context: ''
      },
      loadingList: {
        loading1: false,
        loading2: false,
        cancelRegistrationMsg: false,
        heavyMessagesMsg: false,
        setUserNoticeMsg: false,
        isMoveMsg: false
      },
      callResultMsg: false,
      MeResultMsg: false,
      numCallResult: false,
      localCallResult: false,
      form55: {
        callResult: '',
        MeResultMsg: '',
        numResultMsg: '',
        localResultMsg: ''
      },
      medicalForm: {
        hospitalNo: '',
        date1: '',
        offices: ''

      },
      isSpread: false,
      hospitalMedicalPageIndex: 1,
      hospitalMedicalPageSize: 10,
      isHasMedicalHospital: true,
      medicalHospitalList: [],
      hospitalLocalPageIndex: 1,
      hospitalLocalPageSize: 10,
      isHasLocalHospital: true,
      localHospitalList: [],
      searchLocalTotal: 0,
      errorTip: '',
      rules: {
        idCard: [
          {
            required: true,
            validator: (rule, value, callback) => {
              var pattern =
                /^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2][0-9]|3[0-1])\d{3}[\dXx]$/
              if (!value) {
                return callback(new Error('身份证号码不能为空,请填写!'))
              } else if (!pattern.test(value)) {
                return callback(new Error('请输入正确的身份证号码!'))
              } else {
                this.calculateAge(value)
                callback()
              }
            },
            trigger: 'blur'
          }
        ],
        smsNumber: [
          {
            required: true,
            message: '短信接收号不能为空,请填写',
            trigger: 'blur'
          }
        ]
      },
      payForm: {
        payStyle: '4',
        financeNum: '',
        area: '',
        financeSurplus: '',
        expenseStyle: '',
        caller: '',
        accountRemain: ''
      },
      smsRules: {
        phone: [
          {
            required: true,
            message: '短信接收号码不能为空,请填写',
            trigger: 'blur'
          }
        ],
        context: [
          {
            required: true,
            message: '短信内容不能为空,请填写',
            trigger: 'blur'
          }
        ]
      },
      payRules: {
        accountRemain: [
          {
            required: true,
            message: '账户余额不能为空,请填写',
            trigger: 'blur'
          }
        ],
        caller: [
          {
            required: true,
            message: '当前主叫不能为空,请填写',
            trigger: 'blur'
          }
        ],
        payStyle: [
          {
            required: true,
            message: '付费方式不能为空,请选择',
            trigger: 'blur'
          }
        ],
        financeNum: [
          {
            required: true,
            message: '金融通卡号不能为空,请填写',
            trigger: 'blur'
          }
        ],
        area: [
          {
            required: true,
            message: '区域不能为空,请选择',
            trigger: 'blur'
          }
        ],
        financeSurplus: [
          {
            required: true,
            message: '金融通余额不能为空,请获取',
            trigger: 'blur'
          }
        ],
        expenseStyle: [
          {
            required: true,
            message: '区域不能为空,请选择',
            trigger: 'blur'
          }
        ]
      },
      registrationResult: {},
      rowDataDetail: {},
      data: [],
      defaultProps: {
        children: 'DEPT_LIST',
        label: 'TREENAME'
      },
      tableData: [],
      localTableData: [],
      headerCellStyle: {
        backgroundColor: '#f6f6f7',
        color: '#3b3e41',
        fontSize: '15px'
      },
      isPartInforNunber: 1,
      hospitalList: [],
      currentPage4: 4,
      localCurrentPage: 1,
      localCurrentSize: 10,
      userScheduleList: [],
      isMove: true,
      localTableSelectIndex: 0,
      historyPage: 1,
      historySize: 10,
      dialogVisible: false,
      giveUpVisible: false,
      giveUpRegistration: false,
      repeatSendMessage: false,
      memberDialog: false,
      resultSuccess: true,
      infoDetail: {},
      scheduleTypeList: [],
      scheduleTypeListCopy: [],
      selectHospitalItem: {}, // 选中的医院对象
      selectDepartItem: {}, // 选中的科室对象
      selectHospitalItem2: {}, // his系统挂号信息选中的医院对象
      registeredStatus: [// 挂号状态
        { label: '失败', value: '-1' },
        { label: '正常', value: '0' },
        { label: '电话取消', value: '1' },
        { label: '已停诊', value: '3' },
        { label: '已取号', value: '4' },
        { label: '手机终端挂号', value: '8' },
        { label: '手机终端取消', value: '9' },
        { label: '手机终端挂号,114取消', value: '10' }
      ]
    }
  },
  computed: {
    memoInfo() {
      if (this.selectHospitalItem && this.selectHospitalItem.RECENTMEMOINFO) {
        return this.sanitizeHtml(this.selectHospitalItem.RECENTMEMOINFO)
      }
      return '医院公告'
    }
  },
  watch: {
    activePageIndex(newValue, oldValue) {
      // console.log("newValue", newValue);
      if (newValue === 1) {
        // console.log(this)
        this.$nextTick(() => {
          this.$refs.singleTable.setCurrentRow(this.infoDetail)
        })
        // this.$refs.scheduleInformation.style.minWidth = '1322px'
      }
      //  else {
      //   this.$refs.scheduleInformation.style.minWidth = ''
      // }
    },
    activeIndex(newValue, oldValue) {
      if (newValue === 2) {
        if (this.localHospitalList.length === 0) {
          this.getHospitalList3() // 获取医院
        }
        this.$nextTick(() => {
          this.$refs.localSingleTable.setCurrentRow(this.rowDataDetail)
          if (this.callId && (!this.formLocal.type)) {
            this.formLocal.type = '1'
            this.formLocal.caller = this.caller
          }
        })
      } else if (newValue === 3) {
        if (this.medicalHospitalList.length === 0) {
          this.getHospitalList2() // 获取医院
        }
      }
    }
  },
  mounted: function() {
    console.log('debugFlag', typeof this.debugFlag)
    this.form.date1 = this.tomorrow()
    this.form.date2 = this.sixteenDate()
    this.formLocal.date1 = this.today(2)
    this.formLocal.date2 = this.todaySixteenDate(2)
    this.medicalForm.date1 = this.tomorrow()
    // this.formLocal.date1 = this.tomorrow(); // 注释掉的代码
    this.form2.smsNumber = this.caller
    // var that = this
    this.formInline.date1 = this.tomorrow()
    this.getUserExtendsFlag() // 获取用户标签
    this.getHospitalList() // 获取医院列表
    this.getUserScheduleList() // 获取历史信息
    this.appClickFn()

    // 初始化 DWR 路径
    RegisterationDao._path = '<%=hospitalHisUrlOld%>/dwr'

    // 如果需要监听键盘事件，可以在 $nextTick 中添加
    // this.$nextTick(() => {
    //   window.addEventListener('keyup', this.keyboardFn.bind(this)); // 确保正确绑定 this 上下文
    // });
  },

  methods: {
    // 请求数据封装函数
    request(action, param, callback) {
      var that = this
      axios.post(this.url + action, param, {
        headers: {
          'Content-Type':
            'application/x-www-form-urlencoded;charset=UTF-8'
        }
      }).then(function(response) {
        console.log(response, 101)
        var state = response.data.state
        if (state === (-1 || 500)) {
          if (response.config.url !== '/yq-hospital-mgr/webcall?action=registerationDao.confirmRegistration') {
            that.$message.closeAll()
            that.$message.error(response.data.msg)
          }
          callback(
            null,
            state,
            response.data
          )
        } else {
          callback(response.data, state)
        }
        for (var key in that.loadingList) {
          // console.log("key", key);
          that.loadingList[key] = false
        }
      })
        .catch(function(error) {
          console.log(error)
          // that.$message.closeAll()
          // that.$message.error(error);
          for (var key in that.loadingList) {
            // console.log("key", key);
            that.loadingList[key] = false
          }
        })
    },
    reSelectDepart() {
      this.activePageIndex = 1
      this.$nextTick(() => {
        // this.$refs.singleTable.setCurrentRow(this.infoDetail);
      })
    },
    calculateAge(idCard) {
      const birthYear = idCard.slice(6, 10)
      const birthMonth = idCard.slice(10, 12)
      const birthDay = idCard.slice(12, 14)
      const birthDate = new Date(birthYear + '-' + birthMonth + '-' + birthDay)
      if (!isNaN(birthDate.getTime())) {
        const today = new Date()
        let age = today.getFullYear() - birthDate.getFullYear()
        const monthDiff = today.getMonth() - birthDate.getMonth()
        if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < birthDay)) {
          age--
        }
        this.form2.age = age
      }
    },
    sanitizeHtml(htmlString) {
      if (!htmlString) return ''
      return htmlString
        .replace(/<\/?[^>]+(>|$)/g, '') // 移除HTML标签
        .replace(/&nbsp;/g, ' ') // 替换 &nbsp; 为 空格
        .replace(/&/g, '&') // 正确替换 & 为 &amp;
    },
    selectHospotalFn(val) {
      // console.log(999, val);
      this.hospitalNo = val
      this.oneMsg = false
      this.getScheduleTypeList()
      this.selectHospitalItem = this.hospitalList.find((el) => {
        return el.HOSPITALNO === val
      })

      // console.log(this.selectHospitalItem);
    },
    isShowMenu(boo) {
      if (!boo) {
        this.$nextTick(() => {
          this.$refs.hospitalSelectName.blur()
          this.isPartInforNunber = 2
          if (this.oneMsg) {
            if (this.hospitalList.length > 0) {
              this.formInline.hospitalNo = this.hospitalList[0].HOSPITALNO
              this.selectHospitalItem = this.hospitalList[0]
              this.hospitalNo = this.hospitalList[0].HOSPITALNO
              this.getScheduleTypeList()
            } else {
              setTimeout(() => {
                const selectInstance = this.$refs.hospitalSelectName
                // 判断是否存在实例并触发清除事件
                if (selectInstance) {
                  selectInstance.$emit('clear')
                }
              }, 100)
            }
            this.threeMsg = false
          }
        })
      }
    },
    selectHospotalFn2(val) {
      // console.log(999, val);
      // this.hospitalNo = val;
      // this.getHospitalList2();
      this.twoMsg = false
      this.selectHospitalItem2 = this.medicalHospitalList.find((el) => {
        return el.HOSPITALNO === val
      })

      // console.log(this.selectHospitalItem);
    },
    isShowMenu2(boo) {
      if (!boo) {
        this.$nextTick(() => {
          this.$refs.hospitalSelectName2.blur()
          if (this.twoMsg) {
            if (this.medicalHospitalList.length > 0) {
              this.medicalForm.hospitalNo = this.medicalHospitalList[0].HOSPITALNO
              this.selectHospitalItem2 = this.medicalHospitalList[0]
            } else {
              setTimeout(() => {
                const selectInstance2 = this.$refs.hospitalSelectName2
                // 判断是否存在实例并触发清除事件
                if (selectInstance2) {
                  selectInstance2.$emit('clear')
                }
              }, 100)
            }
            this.twoMsg = false
          }
        })
      }
    },
    selectHospotalFn3(val) {
      // console.log(999, val);
      // this.hospitalNo = val;
      // this.getHospitalList3();
      this.threeMsg = false
      this.selectHospitalItem3 = this.localHospitalList.find((el) => {
        return el.HOSPITALNO === val
      })
      console.log('selectHospitalItem3', this.selectHospitalItem3)
    },
    isShowMenu3(boo) {
      if (!boo) {
        this.$nextTick(() => {
          this.$refs.hospitalSelectName3.blur()
          if (this.threeMsg) {
            if (this.localHospitalList.length > 0) {
              this.formLocal.hospitalNo = this.localHospitalList[0].HOSPITALNO
              this.selectHospitalItem3 = this.localHospitalList[0]
            } else {
              setTimeout(() => {
                const selectInstance3 = this.$refs.hospitalSelectName3
                // 判断是否存在实例并触发清除事件
                if (selectInstance3) {
                  selectInstance3.$emit('clear')
                }
              }, 100)
            }
            this.threeMsg = false
          }
        })
      }
    },
    // 字体高亮
    highlightDoctorName(handeStr, keywords) {
      if (!handeStr) return '--'
      if (keywords) {
        var highlighted = ''
        var i = 0
        while (i < handeStr.length) {
          if (keywords.indexOf(handeStr[i]) !== -1) {
            highlighted += '<span style="color:#ee4822">' + handeStr[i] + '</span>'
            i++
          } else {
            highlighted += handeStr[i]
            i++
          }
        }
        return highlighted
      } else {
        return handeStr
      }
    },
    endRegister() {
      console.log(top.CallControl)
      if (top.CallControl && this.callId) {
        // 挂机
        top.CallControl.clearCall()
      } else {
        this.activePageIndex = 1
      }
      console.log('结束挂号')
    },
    registrationFn(num) {
      this.activePageIndex = num
    },
    handleSelect(key, keyPath) {
      this.activeIndex = key
    },
    handleNodeClick(data, node) {
      this.$nextTick(() => {
        // 移除之前的高亮节点
        const highlightedNodes = document.querySelectorAll('.tree .treeHighLight')
        highlightedNodes.forEach(node => {
          node.classList.remove('treeHighLight')
        })
        if (this.formInline.searchStyle === '按医院') return false
        // 按科室查询 医院高亮
        var currentElement = document.querySelector('.is-current')
        var ancestorElements = []
        while (currentElement) {
          if (currentElement.classList.contains('el-tree-node__children')) {
            ancestorElements.push(currentElement)
          }
          currentElement = currentElement.parentElement
        }
        var currentEl = ancestorElements[ancestorElements.length - 1]
        if (currentEl && currentEl.parentNode) {
          var lebel = currentEl.parentNode.querySelector('.el-tree-node__content').querySelector('.custom-tree-node')
          lebel.classList.add('treeHighLight')
        }
      })

      // TYPE 1医院 2科室 3专业
      this.hospitalType = data.TYPE
      if (this.formInline.searchStyle === '按医院') {
        if (data.TREENO) {
          this.deptNo = data.TREENO
        }
        this.hospitalNo = data.HOSPITALNO
      } else {
        // 按科室
        var departMenu
        if (data.TYPE === 1) {
          departMenu = data
          this.deptNo = ''
        } else {
          departMenu = this.data.find(el => el.FID === data.FID)
          if (data.TREENO) this.deptNo = data.TREENO
        }
        this.hospitalNo = departMenu.HOSPITALNO
        this.selectHospitalItem = departMenu
        console.log('this.data', this.data)
        console.log('选中数据的父级', departMenu)
      }
      if (data.TYPE === 1) {
        this.$refs.afficheContext.classList.remove('afficheCartoon')
        this.$refs.afficheContext.style.transform = 'translateX(0)'
        setTimeout(() => {
          this.$refs.afficheContext.classList.add('afficheCartoon')
        }, 100)
        this.form.offices = ''
        this.selectDepartItem = {}
      } else {
        this.selectDepartItem = data
        if (data.TREENAME) {
          this.form.offices = data.TREENAME
        } else {
          this.form.offices = ''
        }
      }

      this.getScheduleTypeList()
      this.onSubmit2()
    },
    handleScroll() {
      // console.log(55);
      if (!this.isHasHospital) return // 没有数据
      this.hospitalPageIndex++
      this.getHospitalList() // 获取医院
    },
    handleScroll2() {
      if (!this.isHasMedicalHospital) return // 没有数据
      this.hospitalMedicalPageIndex++
      this.getHospitalList2() // 获取医院
    },
    handleScroll3() {
      console.log(55)
      if (!this.isHasLocalHospital) return // 没有数据
      this.hospitalLocalPageIndex++
      this.getHospitalList3() // 获取医院
    },
    saveUserQueryLog(workId, availableregcount) {
      this.request(
        'userScheduleDao.saveUserQueryLog',
        {
          hospitalNo: this.hospitalNo,
          hasDirect: this.selectHospitalItem.HASDIRECT,
          agentId: this.agentId,
          workId: workId,
          caller: this.caller,
          availableregcount: availableregcount,
          callId: this.callId,
          called: this.called
        },
        (data) => {
          // console.log("日志", data);
        }
      )
    },

    async handleClick(val, type) {
      if (!val) return
      if (!this.hospitalNo) {
        this.$message.closeAll()
        this.$message.error('请选择医院！')
        return false
      }
      if (type === 'click') { // 单击行
        this.tableSelectIndex = val.Index
      }
      if (type !== 'action') {
        this.infoDetail = val
      }
      if (Number(val.AVAILABLEREGCOUNT) !== 0) {
        if (val.DUTYDATE && val.WORKID) {
          console.log('数据库状态', this.selectHospitalItem.DBTYPE)
          if (Number(this.selectHospitalItem.DBTYPE) === 0) {
            await this.getAvailableRegCount(val.DUTYDATE, val.WORKID)
          } else {
            await this.getAvailableRegCountOld(val.DUTYDATE, val.WORKID)
          }
        }
      } else {
        this.surplusNumber = 0
      }
      if (type !== 'click') {
        if (Number(val.AVAILABLEREGCOUNT) === 0 || !this.surplusNumber) {
          this.$message.closeAll()
          this.$message.error('暂无号源,无法挂号!')
          return false
        }
        this.activePageIndex = 2
      }
    },
    onSubmit() {
      // var that = this
      // console.log("submit!");
      if (this.formInline.searchStyle === '按医院') {
        if (!this.formInline.hospitalNo) {
          this.$message.closeAll()
          this.$message.error('挂号医院不能为空！')
          return false
        }
        if (!this.formInline.date1) {
          this.$message.closeAll()
          this.$message.error('挂号日期不能为空！')
          return false
        }
        var hospitalInputValue = this.formInline.hospitalNo
        var hospitalObj = this.hospitalList.find(item => item.HOSPITALNO === hospitalInputValue)
        this.selectHospitalItem = hospitalObj
        const data = {
          hospitalNo: this.formInline.hospitalNo,
          dutyDate: this.formInline.date1
        }
        this.request(
          'deptWorkDao.getDeptTreeByHospital',
          {
            hospitalNo: this.formInline.hospitalNo,
            dutyBdate: this.formInline.date1,
            dutyEdate: this.formInline.date1,
            deptNo: '',
            deptName: '',
            doctorName: '',
            scheduleTypeName: ''
          },
          (data, state) => {
            console.log(data)
            if (data && data.data) {
              this.data = data.data
            } else {
              this.data = []
            }
            // 清空右侧数据
            this.resetForm('form', true)
            this.tableData = []
            this.lineDutyTotal = 0
            this.lineDutyPageIndex = 1
            this.lineDutyPageSize = 10
            this.infoDetail = {}
            this.surplusNumber = 0
          }
        )
      } else {
        if (!this.formInline.date1) {
          this.$message.closeAll()
          this.$message.error('挂号日期不能为空！')
          return false
        }
        if (!this.formInline.DepartmentName) {
          this.$message.closeAll()
          this.$message.error('科室/专业不能为空！')
          return false
        }

        var data = {
          dutyBdate: this.formInline.date1,
          dutyEdate: this.formInline.date1,
          deptName: this.formInline.DepartmentName,
          deptNo: '',
          doctorName: '',
          scheduleTypeName: ''
        }
        this.request(
          'deptWorkDao.getDeptTreeBySpecial',
          {
            dutyBdate: this.formInline.date1,
            dutyEdate: this.formInline.date1,
            deptName: this.formInline.DepartmentName,
            deptNo: '',
            doctorName: '',
            scheduleTypeName: ''
          },
          (data) => {
            if (data && data.data) {
              var that = this
              // console.log(data);
              this.data = data.data
              this.$refs.hospitalInputDepart.blur()
              this.data.forEach(function(el, index) {
                el.FID = index
                if (el.DEPT_LIST && el.DEPT_LIST.length > 0) {
                  that.addHospitalState(el.DEPT_LIST, index, that)
                }
              })
              console.log(this.data)
            } else {
              this.data = []
            }
            // 清空右侧数据
            this.resetForm('form', true)
            this.tableData = []
            this.lineDutyTotal = 0
            this.lineDutyPageIndex = 1
            this.lineDutyPageSize = 10
            this.infoDetail = {}
            this.surplusNumber = 0
          }
        )
      }
    },
    addHospitalState(data, i, t) {
      data.forEach(function(el, index) {
        el.FID = i
        if (el.DEPT_LIST && el.DEPT_LIST.length > 0) {
          t.addHospitalState(el.DEPT_LIST, i, t)
        }
      })
    },
    onSubmit2() {
      var hospitalInputValue = this.form.style
      var chineseRegex = /[\u4e00-\u9fa5]/ //
      if (chineseRegex.test(hospitalInputValue)) {
        // 字符串中包含中文
        var hospitalNo = this.scheduleTypeList.find(item => item.SCHEDULETYPENAME === hospitalInputValue)
        if (hospitalNo) {
          this.form.style = hospitalNo.SCHEDULETYPENO
        } else {
          this.$message.closeAll()
          this.$message.error('挂号类型无效，请重新选择!')
          return false
        }
      }
      this.lineDutyPageIndex = 1
      this.getWorkInfoByDeptNo()
    },
    encryptPublic(str, kind) {
      if (!str) return ''
      if (kind === 'name') {
        if (str.length === 2) {
          return str.charAt(0) + '*'
        } else {
          return str.charAt(0) + str.substring(1).replace(/./g, '*')
        }
      }
      if (kind === 'idcard') {
        return str.replace(/^(.{5})(?:\d+)(.{4})$/, '$1********$2')
      }
      if (kind === 'phone') {
        return str.replace(/^(.{3})(?:\d+)(.{4})$/, '$1****$2')
      }
    },
    getWorkInfoByDeptNo() {
      if (!this.hospitalNo) {
        this.$message.closeAll()
        this.$message.error('请选择医院！')
        return false
      }
      this.request(
        'deptWorkDao.getWorkInfoByDeptNo',
        {
          pageIndex: this.lineDutyPageIndex,
          pageType: '3',
          pageSize: this.lineDutyPageSize,
          hospitalNo: this.hospitalNo,
          deptNo: this.deptNo,
          deptName: this.form.offices,
          dutyBdate: this.form.date1,
          dutyEdate: this.form.date2,
          doctorName: this.form.name,
          scheduleTypeNo: this.form.style,
          type: this.hospitalType
        },
        (data) => {
          if (!data) return
          // console.log("表单数据", data);
          if (data && data.data && data.data.length > 0) {
            data.data.forEach((el, index) => {
              el.Index = index
            })
          }
          this.tableData = data.data
          this.lineDutyTotal = data.totalRow
          if (this.tableData.length) {
            this.$refs.singleTable.setCurrentRow(this.tableData[0])
          } else {
            this.infoDetail = {}
            this.surplusNumber = 0
          }
          this.$nextTick(() => {
            var dom = this.$refs.singleTable.$el.querySelector('.el-table__body-wrapper table tr:first-child td:first-child .cell:first-child')
            if (dom) {
              dom.setAttribute('tabindex', '1')
              dom.focus()
            }
            var trDom = document.querySelector('.current-row')
            if (trDom) {
              trDom.scrollIntoView()
            }
            // console.log('dom',dom)
          })
          // this.$refs.singleTable.click();
        }
      )
    },
    findObjectWithTopParent(array, targetTREENO, parent = null) {
      for (const item of array) {
        if (item.TREENO === targetTREENO) {
          return { current: item, topParent: parent }
        }

        if (item.DEPT_LIST && item.DEPT_LIST.length > 0) {
          const result = this.findObjectWithTopParent(item.DEPT_LIST, targetTREENO, item)
          if (result.current) {
            return result
          }
        }
      }

      return { current: null, topParent: null }
    },
    // 根据子级TREENO值查找该子级的最上层父级对象
    getObjects(data, val) {
      for (let i = 0; i < data.length; i++) {
        if (data[i] && data[i].TREENO === val) {
          return [data[i]] // 返回包含当前对象的数组
        }
        if (data[i] && data[i].DEPT_LIST) {
          const d = this.getObjects(data[i].DEPT_LIST, val)
          if (d) {
            return [data[i], ...d] // 使用解构语法连接数组
          }
        }
      }
      return null // 如果没有找到，返回 null
    },
    resetForm(formName, bol) {
      this.form.name = ''
      this.form.style = ''
      if (bol) {
        this.form.offices = ''
      } else {
        this.form.date1 = this.tomorrow()
        this.form.date2 = this.sixteenDate()
      }
    },
    onSubmit4() {
      if (!this.formLocal.hospitalNo) {
        this.$message.closeAll()
        this.$message.error('请选择医院!')
        return false
      }
      if (this.formLocal.type === 1 && !this.formLocal.caller) {
        this.$message.closeAll()
        this.$message.error('请先输入【主叫号码】，再进行查询!')
        return false
      }
      if (this.formLocal.type === 2 && !this.formLocal.hospitalCard) {
        this.$message.closeAll()
        this.$message.error('请先输入【实名卡号】，再进行查询!')
        return false
      }
      if (this.formLocal.type === 3 && !this.formLocal.scheduleDate) {
        this.$message.closeAll()
        this.$message.error('请先输入【就诊日期】，再进行查询!')
        return false
      }
      if (this.formLocal.type === 4 && !this.formLocal.deptName) {
        this.$message.closeAll()
        this.$message.error('请先输入【科室名称】，再进行查询!')
        return false
      }
      if (this.formLocal.type === 5 && !this.formLocal.useridCard) {
        this.$message.closeAll()
        this.$message.error('请先输入【身份证号码】，再进行查询!')
        return false
      }
      if (this.formLocal.type === 6 && !this.formLocal.status) {
        this.$message.closeAll()
        this.$message.error('请先输入【挂号状态】，再进行查询!')
        return false
      }
      if (this.localHospitalList.length === 0 && !this.automaticMsg) {
        this.$message.closeAll()
        this.$message.error('挂号医院无效，请重新选择!')
        return false
      }
      this.automaticMsg = false
      this.localCurrentPage = 1
      this.getLocalScheduleInfo()
    },
    repeatForm4() {
      this.formLocal = {
        hospitalNo: '', // 医生关键字
        doctorName: '',
        userName: '',
        date1: this.today(2), // 开始时间
        date2: this.todaySixteenDate(2), // 结束时间
        type: '',
        status: '',
        // caller: "${param.caller}",
        caller: '',
        hospitalCard: '',
        deptName: '',
        useridCard: '',
        scheduleDate: ''
      }
      this.hospitalLocalPageIndex = 1
      this.hospitalLocalPageSize = 10
      this.localHospitalList = []
      this.getHospitalList3() // 获取医院
    },
    // 获取本地挂号信息
    getLocalScheduleInfoOld(type) {
      this.request(
        'userScheduleDao.getLocalScheduleInfoOld',
        {
          pageIndex: this.localCurrentPage,
          pageSize: this.localCurrentSize,
          pageType: 3,
          hospitalNo: this.formLocal.hospitalNo,
          dutyBdate: this.formLocal.date1,
          dutyEdate: this.formLocal.date2,
          doctorName: this.formLocal.doctorName,
          userName: this.formLocal.userName,
          type: this.formLocal.type,
          caller: this.formLocal.caller,
          scheduleDate: this.formLocal.scheduleDate,
          hospitalCard: this.formLocal.hospitalCard,
          deptName: this.formLocal.deptName,
          useridCard: this.formLocal.useridCard,
          status: this.formLocal.status

          // pageIndex: '1',
          // pageSize: '10',
          // pageType: 3,
          // caller: '66000206',
          // scheduleDate: '2023-08-18',
          // hospitalNo: 'SYY01',
          // type: '1',
          // dutyBdate: '2023-08-01 00:00:01',
          // dutyEdate: '2023-08-30 00:00:01'
        },
        (data, state) => {
          console.log('data', data)
          if (data && data.data && data.data.length > 0) {
            this.localTableData = data.data
            data.data.forEach((el, index) => {
              el.index = index
            })
            this.searchLocalTotal = data.totalRow
            if (!type) this.localTableSelectIndex = 0
            this.$refs.localSingleTable.setCurrentRow(this.localTableData[this.localTableSelectIndex])
            this.isSpread = true
            // setTimeout(() => {
            //   var formHeight = this.$refs.formLocal.$el.clientHeight
            //   if(formHeight == 100) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 203px)'
            //   } else if (formHeight == 150) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 255px)'
            //   } else if (formHeight == 200) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 304px)'
            //   }
            // }, 400);
          } else {
            this.localTableData = []
            this.isSpread = false
            this.searchLocalTotal = 0
            // setTimeout(() => {
            //   var formHeight = this.$refs.formLocal.$el.clientHeight
            //   if(formHeight == 100) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 203px)'
            //   } else if (formHeight == 150) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 255px)'
            //   } else if (formHeight == 200) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 304px)'
            //   }
            // }, 400);
          }
        }
      )
    },
    // 获取本地挂号信息
    getLocalScheduleInfo(type) {
      this.request(
        'userScheduleDao.getLocalScheduleInfo',
        {
          pageIndex: this.localCurrentPage,
          pageSize: this.localCurrentSize,
          pageType: 3,
          hospitalNo: this.formLocal.hospitalNo,
          dutyBdate: this.formLocal.date1,
          dutyEdate: this.formLocal.date2,
          doctorName: this.formLocal.doctorName,
          userName: this.formLocal.userName,
          type: this.formLocal.type,
          caller: this.formLocal.caller,
          scheduleDate: this.formLocal.scheduleDate,
          hospitalCard: this.formLocal.hospitalCard,
          deptName: this.formLocal.deptName,
          useridCard: this.formLocal.useridCard,
          status: this.formLocal.status

          // pageIndex: '1',
          // pageSize: '10',
          // pageType: 3,
          // caller: '66000206',
          // scheduleDate: '2023-08-18',
          // hospitalNo: 'SYY01',
          // type: '1',
          // dutyBdate: '2023-08-01 00:00:01',
          // dutyEdate: '2023-08-30 00:00:01'
        },
        (data, state) => {
          console.log('data', data)
          if (data && data.data && data.data.length > 0) {
            this.localTableData = data.data
            data.data.forEach((el, index) => {
              el.index = index
            })
            this.searchLocalTotal = data.totalRow
            if (!type) this.localTableSelectIndex = 0
            this.$refs.localSingleTable.setCurrentRow(this.localTableData[this.localTableSelectIndex])
            this.isSpread = true
            // setTimeout(() => {
            //   var formHeight = this.$refs.formLocal.$el.clientHeight
            //   if(formHeight == 100) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 203px)'
            //   } else if (formHeight == 150) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 255px)'
            //   } else if (formHeight == 200) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 304px)'
            //   }
            // }, 400);
          } else {
            this.localTableData = []
            this.isSpread = false
            this.searchLocalTotal = 0
            // setTimeout(() => {
            //   var formHeight = this.$refs.formLocal.$el.clientHeight
            //   if(formHeight == 100) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 203px)'
            //   } else if (formHeight == 150) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 255px)'
            //   } else if (formHeight == 200) {
            //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 304px)'
            //   }
            // }, 400);
          }
        }
      )
    },
    localSelectFn(val) {
      console.log('选中行数据', val)
      if (val) {
        this.rowDataDetail = val
        this.localTableSelectIndex = val.index
        this.formSms.phone = val.CURRENTCALLER
        this.formSms.context = val.SMSCONTENT
      } else {
        this.rowDataDetail = {}
        this.localTableSelectIndex = 0
      }
    },

    isSpreadFn() {
      this.isSpread = !this.isSpread
      // setTimeout(() => {
      //   // console.log(this.$refs.formLocal.$el.clientHeight)
      //   // console.log(this.$refs.formLocal)
      //   var formHeight = this.$refs.formLocal.$el.clientHeight
      //   // console.log(document.querySelector('.localSingleTableContainer').classList.add('my-class'))
      //   if(formHeight == 100) {
      //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 203px)'
      //   } else if (formHeight == 150) {
      //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 255px)'
      //   } else if (formHeight == 200) {
      //     document.querySelector('.localSingleTableContainer').style.height = 'calc(100% - 304px)'
      //   }
      // }, 400);
    },
    goLocalDetail() {
      this.formLocal.type = '1'
      this.formLocal.caller = this.caller
      this.formLocal.useridCard = this.form2.idCard
      this.formLocal.hospitalCard = this.form2.cardNumber
      this.formLocal.doctorName = this.infoDetail.DOCTORNAME
      this.formLocal.userName = this.form2.name
      this.formLocal.hospitalNo = this.selectHospitalItem.HOSPITALNAME
      // this.formLocal.hospitalNo = '四川省人民医院'
      this.selectHospitalItem3 = this.selectHospitalItem
      this.localHospitalList.length = 0
      this.activeIndex = '2'
      this.activePageIndex = 1
      this.$nextTick(() => {
        this.formLocal.hospitalNo = this.selectHospitalItem.HOSPITALNO
        this.automaticMsg = true
        this.onSubmit4()
      })
    },
    searchRadio(val) {
      // console.log(val);
      // this.selectHospitalItem = {};
      // if (val === "按科室") {
      //   this.formInline.hospitalNo = "";
      // } else {
      // }
    },
    setUserNotice() {
      if (Object.keys(this.rowDataDetail).length === 0) {
        this.$message.closeAll()
        this.$message.error('请先选中一条数据！')
        return false
      }
      this.loadingList.setUserNoticeMsg = true
      this.request(
        'userScheduleDao.setUserNotice',
        {
          // hospitalNo: 'SYY01',
          // workId: '944936',
          // workFlowId: '18482649',
          hospitalNo: this.selectHospitalItem3.HOSPITALNO,
          workId: this.rowDataDetail.WORKID,
          workFlowId: this.rowDataDetail.WORKFLOWID

        },
        (data, state) => {
          console.log('标识已通知', data)
          if (state === '1') {
            this.$message.closeAll()
            this.$message.success(data.msg)
            this.getLocalScheduleInfo('2')
          }
          this.loadingList.setUserNoticeMsg = false
        }
      )
    },
    // /**
    //  *  去掉左边的所有空格
    //  */
    // L_Trim(s) {
    //   return s.replace(/^\s*/, "");
    // },
    // /**
    //  *  去掉右边的所有空格
    //  */
    // R_Trim(s) {
    //   return s.replace(/\s*$/, "");
    // },
    // /**
    //  *  去掉两边的所有空格
    //  */
    // Trim(s) {
    //   return this.R_Trim(this.L_Trim(s));
    // },
    // 查询VIP用户的实名卡
    checkUserInfoOld() {
      var cardIdStr = this.form2.cardNumber// 实名卡号
      var hospitalNoTemp = this.hospitalNo // 医院编号
      var userIdCardTemp = this.idCard // 输入的身份证号
      var extendsKeyValueInfoTemp = this.extendsKeyValueInfo // 附加信息
      var that = this
      RegisterationDao.checkUserInfo(function(obj) {
        if (obj.UserName === '' || obj.UserName === '正在查询中...稍等!') {
          return
        } else {
          var resultData = obj
          if (resultData && resultData.HOSPITALCARD) {
            that.form2.cardNumber = resultData.HOSPITALCARD
          } else if (resultData.length > 0) {
            that.form2.cardNumber = ''
          }

          if (resultData && resultData.UserIdCard) {
            that.form2.idCard = resultData.UserIdCard
          } else if (resultData.length > 0) {
            that.form2.idCard = ''
          }

          that.form2.name = resultData.UserName || ''
          that.form2.sex = resultData.UserSex === '1' ? '男' : '女'
          that.form2.age = resultData.UserAge && resultData.UserAge.match(/\d+/g).join('')
          that.form2.phone = resultData.UserTel || ''
          that.form2.address = resultData.UserAddress || ''
          that.form2.userId = resultData.UserId || ''
          that.form2.userIdKey = resultData.UserIdKey || ''
          that.form2.userCode = resultData.UserCode || ''
          that.form2.blackPat = resultData.BlackPat || ''
          that.form2.accountRemain = ''

          // 华西医院特色处理
          var HuaXiHospitalArray = that.huaXiHospitalIdOld.split('#')
          for (var i = 0; i < HuaXiHospitalArray.length; i++) {
            var id = HuaXiHospitalArray[i]
            if (id === that.hospitalNo) {
              // 华西医院新增黑名单参数
              var blackUser = obj['BlackPat'] // 是否黑名单用户（Y:是,为空不是）
              if (blackUser === 'Y') {
                that.form2.blackPat = '是'
              } else {
                that.form2.blackPat = '否'
              }
              break
            }
          }
          // smsNumber: resultData.HOSPITALCARD, // 短信接收号
        }
      },
      hospitalNoTemp, cardIdStr, this.agentId, userIdCardTemp, extendsKeyValueInfoTemp
      )
    },
    // 查询用户请求方法
    checkUserInfo() {
      const data = {
        hospitalNo: this.hospitalNo || '',
        hasDirect: this.selectHospitalItem.HASDIRECT || '',
        workId: this.infoDetail.WORKID || '',
        hospitalCard: this.form2.cardNumber || '',
        userIdCard: this.form2.idCard || '',
        agentId: this.agentId || '',
        caller: this.caller || '',
        userTel: this.form2.phone || '',
        userName: this.form2.name || '',
        callResult: this.form55.callResult
      }
      if (!this.debugFlag) delete data.callResult
      var that = this
      this.request(
        'registerationDao.checkUserInfo',
        data,
        (data, state) => {
          // console.log("查询用户", data);
          if ((data && data.state === '0') || (data && data.state === '1')) {
            if (!data.data) return
            var resultData = data.data
            // if(resultData.length == 0) {
            //   this.$message.closeAll()
            //   this.$message.error('无该用户信息!');
            // }
            if (resultData && resultData.HOSPITALCARD) {
              that.form2.cardNumber = resultData.HOSPITALCARD
            } else if (resultData.length > 0) {
              that.form2.cardNumber = ''
            }

            if (resultData && resultData.USERIDCARD) {
              that.form2.idCard = resultData.USERIDCARD
            } else if (resultData.length > 0) {
              that.form2.idCard = ''
            }

            that.form2.name = resultData.USERNAME || ''
            that.form2.sex = resultData.USERSEX === '1' ? '男' : '女'
            that.form2.age = resultData.USERAGE && resultData.USERAGE.match(/\d+/g).join('')
            that.form2.phone = resultData.USERTEL || ''
            that.form2.address = resultData.USERADDRESS || ''
            that.form2.userId = resultData.USERID || ''
            that.form2.userCode = resultData.USERCODE
            that.form2.blackPat = resultData.BlackPat || ''
            that.form2.accountRemain = resultData.ACCOUNTREMAIN || ''
            that.form2.userIdKey = resultData.USERIDKEY || ''
            // smsNumber: resultData.HOSPITALCARD, // 短信接收号

            that.$refs.idCardRef.blur()
          } else {
            if (state !== -1 && state !== 500) {
              that.$message.closeAll()
              that.$message.error(data.msg)
            }
            (that.form2.name = '');
            (that.form2.sex = '男');
            (that.form2.age = '');
            (that.form2.phone = '');
            (that.form2.address = '');
            (that.form2.userId = '');
            (that.form2.userCode = '');
            (that.form2.accountRemain = '');
            (that.form2.blackPat = '');
            (that.form2.userIdKey = '')
          }
        }
      )
    },
    // 查询用户按钮事件
    getCheckUserInfoBtn() {
      if (this.debugFlag) {
        this.callResultMsg = true
      } else {
        this.getCheckUserInfo()
      }
    },
    getCheckUserInfo() {
      this.callResultMsg = false

      var pattern =
        /^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2][0-9]|3[0-1])\d{3}[\dXx]$/
      if (this.form2.idCard === '' || !pattern.test(this.form2.idCard)) {
        this.$refs.ruleForm.validateField('idCard')
        return false
      }
      this.loadingList.loading1 = true
      if (this.selectHospitalItem.DBTYPE === 0) {
        this.checkUserInfo()
      } else {
        this.checkUserInfoOld()
      }
    },
    // 放弃
    giveUpOper() {
      this.giveUpVisible = false
      this.activePageIndex = 1
    },
    giveUpRegFnBtn() {
      if (Object.keys(this.rowDataDetail).length === 0) {
        this.$message.closeAll()
        this.$message.error('请先选中一条数据！')
        return false
      }
      this.giveUpRegistration = true
    },
    giveUpRegFn() {
      if (this.selectHospitalItem3.DBTYPE === 0) {
        this.cancelRegistration()
      } else {
        this.cancelRegistrationOld()
      }
    },
    cancelRegistrationOld() {
      var that = this
      RegisterationDao.cancelScheduleHandle(function(data) {
        const dataStr = String(data)
        if (dataStr.indexOf('1') === 0) {
          that.$message.closeAll()
          that.$message.error(dataStr.replace('1@', ''))
        } else {
          that.$message.closeAll()
          that.$message.success('操作成功')
          that.getLocalScheduleInfo('2')
        }
        that.giveUpRegistration = false
      },
      this.selectHospitalItem3.HOSPITALNO, this.rowDataDetail.WORKFLOWID,
      this.agentNo, this.rowDataDetail.CURRENTCALLER, this.rowDataDetail.SCHEDULEDATE,
      this.rowDataDetail.CREATEDATE, this.extendsKeyValueInfo
      )
    },
    cancelRegistration() {
      const data = {
        hospitalNo: this.selectHospitalItem3.HOSPITALNO,
        hasDirect: this.selectHospitalItem3.HASDIRECT,
        workFlowId: this.rowDataDetail.WORKFLOWID,
        caller: this.rowDataDetail.CURRENTCALLER,
        scheduleDate: this.rowDataDetail.SCHEDULEDATE, // 挂号日期 没有
        createDate: this.rowDataDetail.CREATEDATE, // 来电时间
        agentId: this.formSms.AGENTNO,
        workId: this.rowDataDetail.WORKID,
        callResult: this.form55.localResultMsg
      }
      if (!this.debugFlag) delete data.callResult
      this.loadingList.cancelRegistrationMsg = true
      var that = this
      this.request(
        'registerationDao.cancelRegistration',
        data,
        (data, state, dataList) => {
          if (state === '1' || state === '0') {
            that.$message.closeAll()
            that.$message.success(data.msg)
            that.getLocalScheduleInfo('2')
          } else {
            that.$message.closeAll()
            that.$message.error(dataList.msg)
          }
          that.giveUpRegistration = false
          // this.loadingList.cancelRegistrationMsg = false
        }
      )
    },
    repeatSendMessageFn(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.smsRepeat()
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    smsRepeat() {
      this.loadingList.heavyMessagesMsg = true
      var that = this
      this.request(
        'registerationDao.smsRepeat',
        {
          hospitalNo: this.selectHospitalItem3.HOSPITALNO,
          hospitalLink: this.selectHospitalItem3.HASDIRECT,
          workFlowId: this.rowDataDetail.WORKFLOWID,
          caller: this.rowDataDetail.CURRENTCALLER,
          smsContent: this.formSms.context,
          sendSmsMobile: this.formSms.phone,
          agentId: this.formSms.AGENTNO
        },
        (data, state) => {
          if (state === '1') {
            that.$message.closeAll()
            that.$message.success(data.msg)
            that.repeatSendMessage = false
            // this.getLocalScheduleInfo('2')
          } else {
            that.$message.closeAll()
            that.$message.error(data.msg)
          }
          that.loadingList.heavyMessagesMsg = false
        }
      )
    },
    repeatSendMessageBtn() {
      if (Object.keys(this.rowDataDetail).length === 0) {
        this.$message.closeAll()
        this.$message.error('请先选中一条数据！')
        return false
      }
      this.repeatSendMessage = true
    },
    setNotice() {
      if (Object.keys(this.rowDataDetail).length === 0) {
        this.$message.closeAll()
        this.$message.error('请先选中一条数据！')
        return false
      }
      this.$confirm('确定要标识为已通知吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {

      }).catch(() => {

      })
    },
    confirmRegistrationOld() {
      const data = {
        hasDirect: this.selectHospitalItem.HASDIRECT || '',
        HospitalName: this.selectHospitalItem.HOSPITALNAME,
        HospitalNo: this.selectHospitalItem.HOSPITALNO || '',
        BASTONPAYTYPE: this.selectHospitalItem.BASTONPAYTYPE || '',

        WorkId: this.infoDetail.WORKID || '',
        DepartmentNo: this.infoDetail.DEPTNO || '',
        DepartmentName: this.infoDetail.DEPTNAME || '',
        SpecialityNo: this.infoDetail.SPECIALITYNO || '',
        SpecialityName: this.infoDetail.SPECIALITYNAME || '',
        DoctorNo: this.infoDetail.DOCTORNO || '',
        DoctorName: this.infoDetail.DOCTORNAME || '',
        ScheduleTypeNo: this.infoDetail.SCHEDULETYPENO || '',
        ScheduleTypeName: this.infoDetail.SCHEDULETYPENAME || '',
        ScheduleTime: this.infoDetail.DUTYTIME || '',
        SchedulePrice: this.infoDetail.SCHEDULEPRICE || '',
        ScheduleDate: this.infoDetail.DUTYDATE || '',
        DoctorDegree: this.infoDetail.DOCTORDEGREE || '',

        UserId: this.form2.userId || '',
        UserIdKey: this.form2.userIdKey || '',
        SendSMSMobile: this.form2.smsNumber || '',
        UserIdCard: this.form2.idCard || '',
        UserName: this.form2.name || '',
        UserSex: this.form2.sex || '',
        UserAge: this.form2.age || '',
        UserAddress: this.form2.address || '',
        HospitalCard: this.form2.cardNumber || '',
        UserTel: this.form2.phone || '',
        UserCode: this.form2.userCode || '',

        payWayFlag: this.payForm.payStyle || '',
        PayCityCode: this.payForm.area || '',

        AgentNo: this.agentNo || '',
        extendsKeyValueInfo: this.extendsKeyValueInfo || '',
        CurrentCaller: this.caller || '',

        PaymentCardNo: '',
        AccountMoney: '',
        BillTelNumber: '',
        OwnerId: '',
        arriveTime: 0,
        BasetonePayType: 0
        // BlackPat: '',
        // CallerMoney:  '',
        // PaymentCardMoney: '',
        // CardPassword: '',
      }
      const queryString = new URLSearchParams(data).toString()
      console.log('query', data)
      console.log('queryString', queryString)
      var that = this
      RegisterationDao.addNewSchedule(
        // console.log('获取数据（回调前）：',data,534),
        function(data) {
          if (data.indexOf('[ERROR]:') > -1) {
            var errorDesc = data.split('原因:')[1]
            that.errorTip = errorDesc
            that.resultSuccess = false
          } else {
            var arr = data.split('$')
            var scheduleNo = arr[0] // 排队号
            var workFlowId = arr[1] // 流水号
            var scheduleTimeDuring = arr[2] // 时间段

            var flag = false
            // 华西医院特色处理
            var HuaXiHospitalArray = that.huaXiHospitalIdOld.split('#')
            for (var i = 0; i < HuaXiHospitalArray.length; i++) {
              var id = HuaXiHospitalArray[i]
              if (id === that.hospitalNo) {
                flag = true
                break
              }
            }

            var schedulePassword
            var takeTime
            var visitTime = scheduleTimeDuring
            var takeAdd
            if (that.hospitalNo === '050') {
              schedulePassword = arr[3] // 挂号密码
              takeTime = arr[4] // 取号时间
              visitTime = arr[5] // 就诊时间
              takeAdd = arr[6] // 时间段
            }

            if (that.hospitalNo !== '050') { // 当不是华西医院特色时进入处理 add by wzx 20120423
              takeTime = '' // 取号时间
              takeAdd = '' // 时间段
              if (arr.length > 4) {
                schedulePassword = arr[4] // 挂号密码
              } else {
                schedulePassword = arr[3] // 挂号密码
              }
            }

            that.registrationResult = {
              TAKEADD: takeAdd || '',
              VISITTIME: visitTime || '',
              TAKETIME: takeTime || '',
              WORKFLOWID: workFlowId || '',
              SERIALNUM: scheduleNo || '',
              SCHEDULEPASSWORD: schedulePassword || ''
            }
            console.log('registrationResult', that.registrationResult)
            that.resultSuccess = true
          }
          that.loadingList.loading2 = false
          that.activePageIndex = 4
        },
        queryString
      )
    },
    // 确认挂号方法 或支付
    confirmRegistration() {
      const data = {
        hospitalNo: this.hospitalNo || '',
        hasDirect: this.selectHospitalItem.HASDIRECT || '',
        workId: this.infoDetail.WORKID || '',
        userIdCard: this.form2.idCard || '',
        userIdKey: this.form2.userIdKey || '',
        hospitalCard: this.form2.cardNumber || '',
        userName: this.form2.name || '',
        userSex: this.form2.sex === '男' ? '1' : '2',
        userAge: this.form2.age || '',
        userTel: this.form2.phone || '',
        userAddress: this.form2.address || '',
        sendSmsMobile: this.form2.smsNumber || '',
        userId: this.form2.userId || '',
        agentId: this.agentId || '',
        caller: this.caller || '',
        callResult: this.form55.MeResultMsg,
        payWayFlag: this.payForm.payStyle || '',
        scheduleDate: this.infoDetail.DUTYDATE || ''
      }
      if (!this.debugFlag) delete data.callResult
      this.loadingList.loading2 = true
      var that = this
      this.request(
        'registerationDao.confirmRegistration',
        data,
        (data, state, res) => {
          // console.log("确认挂号", data, state);
          // state = "1"
          if (state === '0' || state === '1') {
            that.registrationResult = data.data
            that.resultSuccess = true
            // this.activePageIndex = 3;
          } else {
            // this.$message.closeAll()
            // this.$message.error(data.msg);
            if (res.msg) {
              that.errorTip = res.msg
            }
            that.resultSuccess = false
          }
          that.loadingList.loading2 = false
          that.activePageIndex = 4
        }
      )
    },
    // 确认挂号按钮事件
    submitForm(formName) {
      var that = this
      this.$refs[formName].validate((valid) => {
        if (valid) {
          that.activePageIndex = 3
          // this.confirmRegistration();
        } else {
          return false
        }
      })
    },
    // 确认支付按钮事件
    submitPayForm(formName) {
      this.$confirm('确定要支付吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        closeOnClickModal: false,
        type: 'warning'
      })
        .then(() => {
          if (this.selectHospitalItem.DBTYPE === 0) {
            this.confirmRegistration()
          } else {
            this.confirmRegistrationOld()
          }
        })
        .catch(() => {
        })

      // var that = this;
      // this.$refs[formName].validate((valid) => {
      //   if (valid) {
      //     // alert("submit!");
      //     this.activePageIndex = 4;
      //   } else {
      //     console.log("error submit!!");
      //     return false;
      //   }
      // });
    },

    handleSizeChange(val) {
      this.lineDutyPageSize = val
      this.getWorkInfoByDeptNo()
    },
    handleCurrentChange(val) {
      this.lineDutyPageIndex = val
      this.getWorkInfoByDeptNo()
    },
    localSizeChange(val) {
      this.localCurrentSize = val
      this.getLocalScheduleInfo()
      // console.log(`每页 ${val} 条`);
    },
    localCurrentChange(val) {
      this.localCurrentPage = val
      this.getLocalScheduleInfo()
      // console.log(`当前页: ${val}`);
    },
    getmoveData() {
      this.historyPage++
      this.getUserScheduleList()
    },
    selectChangeFn() {
      this.formLocal.caller = ''
      this.formLocal.hospitalCard = ''
      this.formLocal.deptName = ''
      this.formLocal.useridCard = ''
      this.formLocal.status = ''
      this.formLocal.scheduleDate = ''
      this.$nextTick(() => {
        this.$refs.searchPrerequisite.blur()
      })
    },
    filterFn(val) {
      // console.log(val);
      // 清除之前的延迟任务
      clearTimeout(this.debounceTimeout)

      // 设置新的延迟任务
      this.debounceTimeout = setTimeout(() => {
        this.hospitalPageIndex = 1
        this.isHasHospital = true
        // 在这里进行数据请求操作，使用 this.searchText 作为搜索关键词
        this.formInline.hospitalNo = val
        this.hospitalList = []
        this.oneMsg = true
        this.getHospitalList()
      }, 300) // 延迟 300 毫秒执行请求，可根据需要调整延迟时间
    },
    filterFn2(val) {
      console.log(val)
      // 清除之前的延迟任务
      clearTimeout(this.debounceTimeout)

      // 设置新的延迟任务
      this.debounceTimeout = setTimeout(() => {
        this.hospitalMedicalPageIndex = 1
        this.isHasMedicalHospital = true
        // 在这里进行数据请求操作，使用 this.searchText 作为搜索关键词
        this.medicalForm.hospitalNo = val
        this.medicalHospitalList = []
        this.twoMsg = true
        this.getHospitalList2()
      }, 300) // 延迟 300 毫秒执行请求，可根据需要调整延迟时间
    },
    filterFn3(val) {
      console.log(val)
      // 清除之前的延迟任务
      clearTimeout(this.debounceTimeout)

      // 设置新的延迟任务
      this.debounceTimeout = setTimeout(() => {
        this.hospitalLocalPageIndex = 1
        this.isHasLocalHospital = true
        // 在这里进行数据请求操作，使用 this.searchText 作为搜索关键词
        this.formLocal.hospitalNo = val
        this.localHospitalList = []
        this.threeMsg = true
        this.getHospitalList3()
      }, 300) // 延迟 300 毫秒执行请求，可根据需要调整延迟时间
    },
    clearSelectFn() {
      this.hospitalPageIndex = 1
      this.isHasHospital = true
      this.formInline.hospitalNo = ''
      this.hospitalList = []
      this.getHospitalList()
      this.hospitalNo = ''
      this.selectHospitalItem = {}
      this.form.offices = ''
      this.$nextTick(() => {
        this.$refs.regStyle.$emit('clear')
        this.form.style = ''
        this.scheduleTypeList = []
      })
    },
    clearSelectFn3() {
      this.hospitalLocalPageIndex = 1
      this.isHasLocalHospital = true
      this.formLocal.hospitalNo = ''
      this.localHospitalList = []
      this.getHospitalList3()
    },
    clearSelectFn2() {
      this.hospitalMedicalPageIndex = 1
      this.isHasMedicalHospital = true
      this.medicalForm.hospitalNo = ''
      this.medicalHospitalList = []
      this.getHospitalList2()
    },
    onSubmit5() {
      if (!this.medicalForm.hospitalNo) {
        this.$message.closeAll()
        this.$message.error('请选择医院！')
        return false
      }
      if (this.medicalHospitalList.length === 0) {
        this.$message.closeAll()
        this.$message.error('挂号医院无效，请重新选择!')
        return false
      }
      if (!this.medicalForm.offices) {
        this.$message.closeAll()
        this.$message.error('实名卡号不能为空！')
        return false
      }
      // 判断是否是华西医院走新接口
      console.log('华西id', this.huaXiHospitalId)
      console.log('选中id', this.medicalForm.hospitalNo)
      var HuaXiHospitalId = this.huaXiHospitalId
      var HuaXiHospitalArray = HuaXiHospitalId.split('#')
      var hospitalNo = this.medicalForm.hospitalNo
      for (var i = 0; i < HuaXiHospitalArray.length; i++) {
        var id = HuaXiHospitalArray[i]
        if (id === this.medicalForm.hospitalNo) {
          hospitalNo = '002'
          break
        }
      }
      if (hospitalNo !== '002') {
        this.$message.error('未开通查询预约记录,请另换医院查询！！')
        return false
      }
      // 查询
      if (this.selectHospitalItem.DBTYPE === 0) {
        this.getHisScheduleInfo()
      } else {
        this.getHisScheduleInfoOld()
      }
    },
    resetMedicalForm() {
      this.medicalForm = {
        hospitalNo: '',
        date1: this.tomorrow(),
        offices: ''
      }
    },
    handleStateFn(state) {
      var result = ''
      switch (state) {
        case '0':
          result = '正常'
          break
        case '1':
          result = '电话取消'
          break
        case '2':
          result = '待停诊'
          break
        case '3':
          result = '已停诊'
          break
        case '4':
          result = '已取号'
          break
        case '5':
          result = '超时违约'
          break
        case '6':
          result = '现场取消'
          break
        case '7':
          result = '已换诊'
          break
        case '8':
          result = '手机终端挂号'
          break
        case '9':
          result = '手机终端取消'
          break
        case '10':
          result = '手机终端挂号,114取消'
          break
        case '11':
          result = 'IVR流程挂号'
          break
        case '12':
          result = '停诊（未取号）'
          break
        case '13':
          result = '停诊（已取号）'
          break
        case '14':
          result = '换诊取消'
          break
        case '15':
          result = '换诊预约（未取号）'
          break
        case '16':
          result = '换诊预约（已取号）'
          break
        case '-1':
          result = '失败'
          break
        default:
          result = '--'
      }
      return result
    },
    getHisScheduleInfoOld() {
      var extendsKeyValueInfo = 'RBASDate:' + this.medicalForm.date1 // 附加信息
      var that = this
      RegisterationDao.queryAppointInfo(function(data) {
        console.log('data', data)
        if (data && data.AppointInfoList.AppointInfo.length > 0) {
          that.medicalTableData = data.AppointInfoList.AppointInfo
        } else {
          that.medicalTableData = []
        }
      }, this.medicalForm.hospitalNo, this.agentId, this.medicalForm.offices, extendsKeyValueInfo)
    },
    getHisScheduleInfo() {
      var that = this
      const data = {
        hospitalNo: this.medicalForm.hospitalNo,
        hasDirect: this.selectHospitalItem2.HASDIRECT,
        callResult: this.form55.MeResultMsg,
        hospitalCard: this.medicalForm.offices,
        scheduleDate: this.medicalForm.date1 || '',
        caller: this.caller,
        agentId: this.agentId
      }
      if (!this.debugFlag) delete data.callResult
      this.request(
        'registerationDao.queryAppointInfo',
        data,
        (data) => {
          console.log('data', data)
          if (data && data.data.Response && data.data.Response.AppointInfoList.AppointInfo.length > 0) {
            that.medicalTableData = data.data.Response.AppointInfoList.AppointInfo
          } else {
            that.medicalTableData = []
          }
        }
      )
    },
    getHospitalList() {
      this.request(
        'hospitalDao.getHospitalList',
        {
          pageIndex: this.hospitalPageIndex,
          pageSize: this.hospitalPageSize,
          pageType: 3,
          hospitalName: this.formInline.hospitalNo,
          hospitalNo: ''
        },
        (data) => {
          if (!data) return
          // console.log("获取挂号医院", data);
          if (data.data && data.data.length > 0) {
            data.data.forEach((el) => {
              this.hospitalList.push(el)
            })
          }
          if (
            data.data.length === 0 ||
            data.data.length < this.hospitalPageSize
          ) {
            this.isHasHospital = false
          }
        }
      )
    },
    getHospitalList2() {
      this.request(
        'hospitalDao.getHospitalList',
        {
          pageIndex: this.hospitalMedicalPageIndex,
          pageSize: this.hospitalMedicalPageSize,
          pageType: 3,
          hospitalName: this.medicalForm.hospitalNo,
          hospitalNo: ''
        },
        (data) => {
          if (!data) return
          console.log('获取挂号医院', data)
          if (data.data && data.data.length > 0) {
            data.data.forEach((el) => {
              this.medicalHospitalList.push(el)
            })
          }
          if (
            data.data.length === 0 ||
            data.data.length < this.hospitalMedicalPageSize
          ) {
            this.isHasMedicalHospital = false
          }
        }
      )
    },
    getHospitalList3() {
      this.request(
        'hospitalDao.getHospitalList',
        {
          pageIndex: this.hospitalLocalPageIndex,
          pageSize: this.hospitalLocalPageSize,
          pageType: 3,
          hospitalName: this.formLocal.hospitalNo,
          hospitalNo: ''
        },
        (data) => {
          if (!data) return
          console.log('获取挂号医院', data)
          if (data.data && data.data.length > 0) {
            data.data.forEach((el) => {
              this.localHospitalList.push(el)
            })
          }
          if (
            data.data.length === 0 ||
            data.data.length < this.hospitalLocalPageSize
          ) {
            this.isHasLocalHospital = false
          }
        }
      )
    },
    getUserExtendsFlag() {
      this.request(
        'userScheduleDao.getUserExtendsFlag',
        {
          caller: this.caller
        },
        (data) => {
          if (!data) return
          // console.log("用户标签", data);
          this.userMark = data.data
          if (this.userMark && this.userMark.YOUFU_VIP_LIST.length > 0) {
            this.userPhoneMeal = this.userMark.YOUFU_VIP_LIST[0].VIP_DEGREE.split('，')
          }
        }
      )
    },
    getUserScheduleList() {
      var that = this
      this.loadingList.isMoveMsg = true
      this.request(
        'userScheduleDao.getUserScheduleList',
        {
          pageIndex: this.historyPage,
          pageSize: this.historySize,
          pageType: 3,
          caller: this.caller
        },
        (data) => {
          if (!data) return
          const historyData = data.data
          if (historyData) {
            historyData.forEach((el) => {
              var hasIndex = that.userScheduleList.findIndex((item) => {
                return item.HOSPITALNAME === el.HOSPITALNAME
              })
              if (hasIndex !== -1) {
                that.userScheduleList[hasIndex].children.push({
                  DEPARTMENTNAME: el.DEPARTMENTNAME,
                  DOCTORNAME: el.DOCTORNAME,
                  CREATEDATE: el.CREATEDATE
                })
              } else {
                that.userScheduleList.push({
                  HOSPITALNAME: el.HOSPITALNAME,
                  children: [
                    {
                      DEPARTMENTNAME: el.DEPARTMENTNAME,
                      DOCTORNAME: el.DOCTORNAME,
                      CREATEDATE: el.CREATEDATE
                    }
                  ]
                })
              }
            })

            if (this.historyPage * this.historySize >= data.totalRow) {
              that.isMove = false
            }
          }
          this.loadingList.isMoveMsg = false
          // console.log(historyData, 111);
          // console.log(this.userScheduleList, "userScheduleList");
        }
      )
    },
    // 根据日期获取星期
    handleDataweek(date) {
      // 创建一个日期对象，参数是日期字符串（YYYY-MM-DD）
      const dateString = date
      const dateObject = new Date(dateString)

      // 获取星期几的数字（0 表示星期日，1 表示星期一，以此类推）
      const dayOfWeek = dateObject.getDay()

      // 将数字转换为对应的星期几
      const daysOfWeekText = [
        '星期日',
        '星期一',
        '星期二',
        '星期三',
        '星期四',
        '星期五',
        '星期六'
      ]
      const dayName = daysOfWeekText[dayOfWeek]
      return dayName
    },
    // 获取挂号类型
    getScheduleTypeList() {
      if (!this.hospitalNo) return
      this.request(
        'deptWorkDao.getScheduleTypeList',
        {
          hospitalNo: this.hospitalNo,
          deptNo: this.deptNo,
          deptName: this.form.offices,
          type: this.hospitalType
          // hospitalNo: "SYY01",
          // deptNo: "0308",
          // deptName: "",
        },
        (data) => {
          if (!data) return
          // console.log("挂机类型", data);
          if (data.data && data.data.length > 0) {
            data.data.unshift({
              SCHEDULETYPENAME: '全部',
              SCHEDULETYPENO: '',
              SPECIALITYNAMEABBR: ''
            })
            this.scheduleTypeList = ''
            this.form.style = ''
            this.scheduleTypeList = data.data
            this.scheduleTypeListCopy = data.data
          }
        }
      )
    },
    lookHospotalaffiche() {
      if (this.selectHospitalItem.RECENTMEMOINFO) {
        this.dialogVisible = true
      } else {
        this.$message.closeAll()
        this.$message.error('请选择医院和科室！')
      }
    },
    // 获取剩余号源
    getAvailableRegCountOld(arriveTime, workId) {
      var that = this
      return new Promise((resolve, reject) => {
        var queryParams = 'AgentNo=' + this.agentNo + '&HospitalNo=' + this.formInline.hospitalNo + '&WorkId=' + workId + '&arriveTime=0&extendsKeyValueInfo=<%=extendsKeyValueInfo%>'
        queryParams = encodeURIComponent(queryParams)
        RegisterationDao.getAvailableRegCount(function(data) {
          console.log('剩余号源', data)
          // debugger
          if (data !== null) {
            that.surplusNumber = parseInt(data)
            that.saveUserQueryLog(workId, parseInt(data))
          } else {
            that.surplusNumber = 0
            that.saveUserQueryLog(workId, 0)
          }
          resolve(data)
        }, queryParams)
      })
    },
    // 获取剩余号源
    getAvailableRegCount(arriveTime, workId) {
      var that = this
      var data = {
        hospitalNo: this.hospitalNo,
        hasDirect: this.selectHospitalItem.HASDIRECT,
        workId: workId,
        arriveTime: arriveTime,
        agentId: this.agentId,
        caller: this.caller,
        callResult: this.form55.numResultMsg
      }
      if (!this.debugFlag) delete data.callResult
      return new Promise((reslove, reject) => {
        this.request(
          'registerationDao.getAvailableRegCount',
          data,
          (data) => {
            console.log('剩余号源', data)
            // debugger
            if (data?.data?.AVAILABLEREGCOUNT) {
              that.surplusNumber = data.data.AVAILABLEREGCOUNT
              that.saveUserQueryLog(workId, data.data.AVAILABLEREGCOUNT)
            } else {
              that.surplusNumber = 0
              that.saveUserQueryLog(workId, 0)
            }
            reslove(data)
          }
        )
      })
    },
    // 更多操作
    angetGuideHandle(type) {
      if (!this.callId) {
        this.$message.closeAll()
        this.$message.error('当前无用户来电，不能该操作！')
        return false
      }
      // console.log(2);
      this.$confirm('确定要进行此操作吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.request(
            'userScheduleDao.angetGuideHandle',
            {
              //   hospitalNo: this.formInline.hospitalNo,
              callId: this.callId,
              caller: this.caller,
              called: this.called,
              agentId: this.agentId,
              type: type // 0：成功引导 1：拒绝代办陪诊 2：拒绝代挂号 3：其它1 4：其它2
            },
            (data, state) => {
              if (!data) return
              if (data.state === '1' || data.state === '0') {
                this.$message.closeAll()
                this.$message.success(data.msg)
                if (type === 1 || type === 2) this.getUserExtendsFlag()
              } else if (data.state !== -1 && data.state !== 500) {
                this.$message.closeAll()
                this.$message.error(data.msg)
              }
              // console.log("更多操作", data);
            }
          )
        })
        .catch(() => {
        })
    },
    scheduleTypeListFilter(val) {
      //   debugger;
      this.form.style = val
      if (val) {
        // val存在
        // debugger;
        this.scheduleTypeList = this.scheduleTypeListCopy.filter((item) => {
          if (
            !!~item.SCHEDULETYPENAME.indexOf(val) ||
            !!~item.SCHEDULETYPENAME.toUpperCase().indexOf(
              val.toUpperCase()
            ) ||
            !!~item.SPECIALITYNAMEABBR.indexOf(val) ||
            !!~item.SPECIALITYNAMEABBR.toUpperCase().indexOf(
              val.toUpperCase()
            )
          ) {
            return true
          }
        })
      } else {
        // val为空时，还原数组
        this.scheduleTypeList = this.scheduleTypeListCopy
      }
    },
    isShowFn(boo) {
      if (!boo) {
        this.$nextTick(() => {
          this.$refs.regStyle.blur()
        })
      }
    },
    clearStyleFn() {
      this.scheduleTypeList = this.scheduleTypeListCopy
    },
    timeChangeFn(time) {
      // console.log(time)
      this.form.date1 = time
      this.form.date2 = this.todaySixteenDate(null, time)
    },
    today(type) {
      // debugger;
      // 获取当天日期
      var today = new Date()
      // 获取明天日期
      var tomorrow = new Date(today)
      // 格式化日期为 yyyy-MM-dd 格式
      var year = tomorrow.getFullYear()
      var month = (tomorrow.getMonth() + 1).toString().padStart(2, '0')
      var day = tomorrow.getDate().toString().padStart(2, '0')
      var hours = tomorrow.getHours().toString().padStart(2, '0')
      var minutes = tomorrow.getMinutes().toString().padStart(2, '0')
      var seconds = tomorrow.getSeconds().toString().padStart(2, '0')
      if (type) {
        return year + '-' + month + '-' + day + ' 00:00:00'
      } else {
        return year + '-' + month + '-' + day
      }
    },
    tomorrow(type) {
      // debugger;
      var today = new Date()
      // 获取明天日期
      var tomorrow = new Date(today)
      tomorrow.setDate(tomorrow.getDate() + 1)
      // 格式化日期为 yyyy-MM-dd 格式
      var year = tomorrow.getFullYear()
      var month = (tomorrow.getMonth() + 1).toString().padStart(2, '0')
      var day = tomorrow.getDate().toString().padStart(2, '0')
      var hours = tomorrow.getHours().toString().padStart(2, '0')
      var minutes = tomorrow.getMinutes().toString().padStart(2, '0')
      var seconds = tomorrow.getSeconds().toString().padStart(2, '0')
      if (type) {
        return year + '-' + month + '-' + day + ' 00:00:00'
      } else {
        return year + '-' + month + '-' + day
      }
    },
    todaySixteenDate(type, time) {
      let today
      if (time) {
        today = new Date(time)
      } else {
        today = new Date()
      }
      // 获取当天日期
      // 获取6天后的日期
      const tomorrow = new Date(today)
      tomorrow.setDate(tomorrow.getDate() + 6)
      // 格式化日期为 yyyy-MM-dd 格式
      const year = tomorrow.getFullYear()
      const month = (tomorrow.getMonth() + 1).toString().padStart(2, '0')
      const day = tomorrow.getDate().toString().padStart(2, '0')
      const hours = tomorrow.getHours().toString().padStart(2, '0')
      const minutes = tomorrow.getMinutes().toString().padStart(2, '0')
      const seconds = tomorrow.getSeconds().toString().padStart(2, '0')
      if (type) {
        return year + '-' + month + '-' + day + ' 23:59:59'
      } else {
        return year + '-' + month + '-' + day
      }
    },
    sixteenDate(type) {
      // 获取当天日期
      const today = new Date()
      // 获取16天后的日期
      const tomorrow = new Date(today)
      tomorrow.setDate(tomorrow.getDate() + 7)
      // 格式化日期为 yyyy-MM-dd 格式
      const year = tomorrow.getFullYear()
      const month = (tomorrow.getMonth() + 1).toString().padStart(2, '0')
      const day = tomorrow.getDate().toString().padStart(2, '0')
      // const hours = tomorrow.getHours().toString().padStart(2, '0')
      // const minutes = tomorrow.getMinutes().toString().padStart(2, '0')
      // const seconds = tomorrow.getSeconds().toString().padStart(2, '0')
      if (type) {
        return year + '-' + month + '-' + day + ' 23:59:59'
      } else {
        return year + '-' + month + '-' + day
      }
    },
    appClickFn() {
      var that = this

      window.addEventListener('keydown', function(e) {
        console.log('e.keyCode', e.keyCode)

        if (that.activeIndex === '1') {
          // 医疗挂号
          if (that.activePageIndex === 1) {
            // 医院科室信息
            var dataLength = that.tableData.length - 1
            if (e.keyCode === 38) {
              // 上键
              e.preventDefault()
              // console.log(1);
              if (that.tableSelectIndex > 0) {
                that.tableSelectIndex--
                // console.log(that.tableSelectIndex);
                that.$refs.singleTable.setCurrentRow(
                  that.tableData[that.tableSelectIndex]
                )
              }
              that.$nextTick(() => {
                var trDom = document.querySelector('.current-row')
                if (trDom) {
                  trDom.scrollIntoView()
                }
              })
            } else if (e.keyCode === 40) {
              // 下键
              e.preventDefault()
              // console.log(2);
              if (that.tableSelectIndex < dataLength) {
                that.tableSelectIndex++
                // console.log(that.tableSelectIndex);
                that.$refs.singleTable.setCurrentRow(
                  that.tableData[that.tableSelectIndex]
                )
              }
              that.$nextTick(() => {
                var trDom = document.querySelector('.current-row')
                if (trDom) {
                  trDom.scrollIntoView(false)
                }
              })
            }

            if (e.keyCode === 32) {
              // 空格
              e.preventDefault()
              if (Object.keys(that.infoDetail).length) {
                that.handleClick(that.infoDetail, 'action')
              }
            } else if (e.keyCode === 13) { // 回车
              if (document.activeElement.tagName.toLowerCase() !== 'input') {
                if (that.isPartInforNunber === 1) {
                  that.onSubmit2()
                } else if (that.isPartInforNunber === 2) {
                  that.onSubmit()
                }
              }
            } else if (e.keyCode === 112) { // f1
              e.preventDefault()
              that.formInline.searchStyle = '按医院'
              that.$nextTick(() => {
                that.$refs.hospitalSelectName.focus()
              })
            } else if (e.keyCode === 113) { // f2
              e.preventDefault()
              that.formInline.searchStyle = '按科室'
              that.$nextTick(() => {
                that.$refs.hospitalInputDepart.focus()
              })
            } else if (e.keyCode === 37) { // 左键
              if (document.activeElement.tagName.toLowerCase() !== 'input') {
                e.preventDefault()
                const paginationComponent = that.$refs.paginationRef
                // 查找 gradePagination 组件下的 class 为 btn-next 的元素并点击
                const nextBtn = paginationComponent.$el.querySelector('.btn-prev')
                if (nextBtn) {
                  nextBtn.click()
                }
              }
            } else if (e.keyCode === 39) { // 右键
              if (document.activeElement.tagName.toLowerCase() !== 'input') {
                e.preventDefault()
                const paginationComponent = that.$refs.paginationRef
                // 查找 gradePagination 组件下的 class 为 btn-next 的元素并点击
                const nextBtn = paginationComponent.$el.querySelector('.btn-next')
                if (nextBtn) {
                  nextBtn.click()
                }
              }
            }
          } else if (that.activePageIndex === 2) {
            // 受理挂号业务
            // console.log(document.activeElement.tagName.toLowerCase());
            if (e.keyCode === 13) {
              // 回车
              if (document.activeElement.tagName.toLowerCase() !== 'input') {
                e.preventDefault()
                // console.log(that.giveUpVisible);
                if (that.giveUpVisible) {
                  // that.giveUpOper(); // 放弃挂号
                } else {
                  that.$refs.getUserInfo.$el.click()
                  // that.getCheckUserInfo(); // 调用查询用户
                }
              }
            } else if (e.keyCode === 9) {
              // tab
              // e.preventDefault();
            } else if (e.keyCode === 27) {
              // esc
              e.preventDefault()
              // console.log(that.$refs.selfDialog.$el)
              const computedStyle = window.getComputedStyle(
                that.$refs.selfDialog.$el
              )
              if (computedStyle.display === 'none') {
                that.giveUpVisible = true
              }
            } else if (e.keyCode === 32) {
              // 空格
              // if (document.activeElement.tagName.toLowerCase() !== "input") {
              //   e.preventDefault();
              //   that.submitForm("ruleForm");
              // }
              var messageDom = document.querySelector(
                '.el-message-box__wrapper'
              )
              // console.log(messageDom);
              if (messageDom) { var styleList = window.getComputedStyle(messageDom) }
              var activeTagName =
                document.activeElement.tagName.toLowerCase()
              if (
                activeTagName !== 'input' &&
                (!messageDom || styleList.display === 'none') &&
                !that.giveUpVisible
              ) {
                e.preventDefault()
                that.submitForm('ruleForm')
              }
              if (that.giveUpVisible) {
                that.giveUpOper() // 放弃支付
              }
            } else if (e.keyCode === 37) {
              if (document.activeElement.tagName.toLowerCase() !== 'input') {
                that.activePageIndex = 1
              }
            }
          } else if (that.activePageIndex === 3) {
            if (e.keyCode === 32) {
              // 空格
              var messageDom = document.querySelector(
                '.el-message-box__wrapper'
              )
              // console.log(messageDom);
              if (messageDom) { var styleList = window.getComputedStyle(messageDom) }
              var activeTagName =
                document.activeElement.tagName.toLowerCase()
              if (
                activeTagName !== 'input' &&
                (!messageDom || styleList.display === 'none') &&
                !that.giveUpVisible
              ) {
                e.preventDefault()
                that.submitPayForm('PayRuleForm')
              }
              if (that.giveUpVisible) {
                that.giveUpOper() // 放弃支付
              }
              if (messageDom && styleList.display !== 'none' && activeTagName !== 'input' && activeTagName !== 'button' && !that.giveUpVisible) {
                // 在 .el-message-box__wrapper 内查找所有的 button 元素
                const buttons = messageDom.querySelectorAll('button')

                // 遍历所有 button 元素
                buttons.forEach(button => {
                  // 检查按钮的文本是否是 "确定"
                  if (button.textContent.trim() === '确定') {
                    // 这是你要找的按钮
                    // console.log('找到了 "确定" 按钮:', button);
                    button.click()
                  }
                })
              }
            } else if (e.keyCode === 27) {
              // esc
              e.preventDefault()
              // console.log(that.$refs.selfDialog.$el)
              var messageDom = document.querySelector(
                '.el-message-box__wrapper'
              )
              if (messageDom) { var styleList = window.getComputedStyle(messageDom) }
              var computedStyle = window.getComputedStyle(
                that.$refs.selfDialog.$el
              )
              if (
                computedStyle.display === 'none' &&
                (!messageDom || styleList.display === 'none')
              ) {
                that.giveUpVisible = true
              }
            } else if (e.keyCode === 13) {
              // 回车
              if (document.activeElement.tagName.toLowerCase() !== 'input') {
                e.preventDefault()
              }
            } else if (e.keyCode === 37) {
              if (document.activeElement.tagName.toLowerCase() !== 'input') {
                that.activePageIndex = 2
              }
            }
          }
        } else if (that.activeIndex === '2') {
          // 本地挂号信息
          if (e.keyCode === 13) {
            // 回车
            console.log('聚焦元素', document.activeElement.tagName.toLowerCase())
            if (document.activeElement.tagName.toLowerCase() !== 'input') {
              e.preventDefault()
              that.onSubmit4()
            }
          }
        }
      })
    }
  }
}

top.ccbarEvent.addEvent('evtDisConnected', function(event) {
  try {
    // debugger
    // console.log('top.ccbar_status.callevent',top.ccbar_status.callevent)
    // console.log('id',top.ccbar_status.callevent.urls[0].id)
    if (top.ccbar_status.callevent) {
      const id = top.ccbar_status.callevent.urls[0].id
      top.popup.closeTab({
        id: id
      })
    }
  } catch (e) {
    return
  }
})
</script>
<style scoped>
@import 'src/icons/css/reset.css';
@import 'src/icons/css/element.css';
@import 'src/icons/css/index.css';

/* 组件专属样式 */
</style>
